`

jQuery中整个Ajax的提交,form表单,以及json

阅读更多

-----form表单

function formSend(form1,callback,params){
   if(params)
       injectParams(form1,params);
  
   if(form1.enctype != "multipart/form-data")
        jQuery.post(form1.action,$(form1).serialize(),function(jsonobj){
               if(jsonobj.exception){
                   alert("Error:"+jsonobj.msg);
                   return;
               }
               if(callback)
                  callback(jsonobj);
        },"json");
    else
        formSubmit(form1,callback);

}

 

-----提交到jframe

function formSubmit(form1,callback){

  if(  $("iframe[name=resultframe]").size()==0 ){
      $("body").append('<iframe name="resultframe" width="0px" height="0px"></iframe>');
  }
  if(callback)
  iframeCallback = callback;

  form1.target = "resultframe";
  form1.submit();
   
}
原始。jsp:
<iframe name="frame" style="display:none" width="300" height="300"></iframe>
<script type="text/javascript">
     function sureexam(){
      document.getElementById("kks").target="frame";
      document.getElementById("kks").submit();
      $("#queding").hide();
</script>

跳转到的iframe:
<%@ page contentType="text/html; charset=gbk"%>
<%@ taglib prefix="s" uri="/struts-tags"%>
<script type="text/javascript">
<s:if test="flag==true">
window.parent.document.getElementById("loginForm").submit();
</s:if>
<s:else>
window.parent.showdiv();
</s:else>
</script>
判断传过来的值,然后跳转到相应的页面,就是涮新ifram,但是原始的没有提交。

 

 

------本页面的进去jQuery的ajax

 

 

function processParams(params){
     var rparams = "";
       if(params)
       for(var prop in params){
           var pvalue = params[prop];
           if( $.isArray(pvalue) ){
               for(var i=0;i<pvalue.length;i++){
                   var obj = pvalue[i];
                   if("object" == typeof obj){
                       for(var oprop in obj){
                           rparams += "&"+prop+"["+i+"]."+oprop+"="+ encodeURIComponent(obj[oprop]);
                       }
                   }else{
                       rparams += "&"+prop+"="+encodeURIComponent(obj)
                   }
               }
           }else{
               rparams += "&"+prop+"="+encodeURIComponent(pvalue);
           }
       }
  
       return rparams;
}

function injectParams(form1,params){
    if(params)
       for(var prop in params){
           var pvalue = params[prop];
           if( $.isArray(pvalue) ){
               for(var i=0;i<pvalue.length;i++){
                   var obj = pvalue[i];
                   if("object" == typeof obj){
                       for(var oprop in obj){
                           $("<input type=hidden name='"+prop+"["+i+"]."+oprop+"'>").val(obj[oprop]).appendTo($(form1));
                       }
                   }else{
                       $("<input type=hidden name='"+prop+"'>").val(obj).appendTo($(form1));
                   }
               }
           }else{
           $("<input type=hidden name='"+prop+"'>").val(pvalue).appendTo($(form1));
           }
       }

}

function actionCall(action,params,callback){

    params = processParams(params);

   jQuery.post(action,params,function(jsonobj){
    if(jsonobj.exception){
     alert("Error:"+jsonobj.msg);
     return;
    }
    if(callback)
    callback(jsonobj);

 },"json");

}

function formSend(form1,callback,params){
   if(params)
       injectParams(form1,params);
  
   if(form1.enctype != "multipart/form-data")
        jQuery.post(form1.action,$(form1).serialize(),function(jsonobj){
               if(jsonobj.exception){
                   alert("Error:"+jsonobj.msg);
                   return;
               }
               if(callback)
                  callback(jsonobj);
        },"json");
    else
        formSubmit(form1,callback);

}

function formSubmit(form1,callback){

  if(  $("iframe[name=resultframe]").size()==0 ){
      $("body").append('<iframe name="resultframe" width="0px" height="0px"></iframe>');
  }
  if(callback)
  iframeCallback = callback;

  form1.target = "resultframe";
  form1.submit();
   
}

var iframeCallback = function(){
    alert("iframeCallback is called!");
};

分享到:
评论

相关推荐

    使用JQuery实现从JSON对象转换为form提交数据

    在前端开发中,有时我们需要将JSON格式的数据转换成表单(form)的格式进行提交,以便于服务器端处理。在JavaScript的世界里,jQuery库提供了一种便捷的方式来进行这样的转换。本篇文章将深入探讨如何利用jQuery从...

    JQuery Ajax提交整个表单

    总结,使用jQuery的Ajax功能提交整个表单涉及的关键点包括:`serialize()`方法、`$.ajax()`或其简化版`$.post()`/`$.get()`、阻止表单默认提交、处理服务器响应以及跨域问题。理解这些概念和用法,能够帮助开发者在...

    使用jQuery ajax提交表单代码

    在“使用jQuery ajax提交表单代码”的资源中,我们可以期待看到一个清晰的示例,展示如何将表单数据发送到服务器,并处理响应。 1. **jQuery的$.ajax()函数** - **基本语法**:`$.ajax({ options });` - **选项...

    ajaxForm异步提交表单(含图片)

    AjaxForm是jQuery Form Plugin的一个功能,用于实现异步表单提交,特别是处理包含图片在内的复杂数据。本文将深入探讨如何使用ajaxForm进行异步表单提交。 首先,让我们了解什么是Ajax。AJAX(Asynchronous ...

    使用jQuery.form插件,实现完美的表单异步提交

    在开始之前,请确保已经在项目中引入了jQuery库以及jQuery.form插件。通常,这两个文件可以通过CDN或者本地文件系统导入。例如: ```html &lt;script src="https://code.jquery.com/jquery-3.6.0.min.js"&gt;&lt;/script&gt; ...

    html对应的文件中 将form 表单数据 转化为json 格式

    本篇将详细介绍如何在HTML表单中收集数据,并利用jQuery的`ajax`方法将这些数据转化为JSON格式,以便于插入Oracle数据库。 首先,让我们了解一下HTML表单的基本结构。一个简单的HTML表单可能包含以下元素: ```...

    jquery异步提交form表单

    本文将深入探讨“jQuery异步提交form表单”这一主题,结合给出的标签“源码”和“工具”,我们将分析相关源码,并提供实际应用中的指导。 在传统的HTML表单提交过程中,页面会跳转到服务器返回的结果页面,这在用户...

    ajax提交表单到后台

    本主题将深入探讨如何使用jQuery库的AJAX功能将表单数据提交到后台,以及后台如何使用Spring框架来处理这些数据。下面将详细阐述这一过程。 ### 一、前端:使用jQuery的AJAX提交表单 1. **引入jQuery库**:首先...

    使用AJAX提交Form表单实例演示

    总结,这个实例演示了如何使用jQuery和AJAX来实现Form表单的无刷新提交。通过这种方式,用户可以在提交表单后立即看到结果,而无需等待页面刷新,提高了交互性和用户体验。记住,实际应用中你需要根据具体需求调整...

    jQuery ajax提交Form表单实例(附demo源码)

    本文将详细讲解如何使用jQuery的`$.ajax`方法来提交Form表单,以及如何通过自定义函数实现更灵活的表单提交。 首先,传统的HTML Form表单提交会导致页面刷新,用户体验不佳。为了实现无刷新提交,我们可以利用...

    Ajax表单提交插件jquery form

    使用jQuery选择器选取要处理的表单,并调用`.ajaxForm()`或`.form()`方法初始化插件。 ```javascript $('#myForm').ajaxForm(options); ``` 其中,`#myForm`是表单的ID,`options`是一个可选的对象参数,用于...

    ajax验证并提交表单的两种方法博客源码

    本资源通过ajax实现对提交的form表单的验证,该代码不但有针对property验证,也有针对object验证,还有一个异步获取对象的实例;包含完整的代码和库文件;在myeclipse8.5和apache-tomcat-6.0.30测试通过;访问网址:...

    JQuery.form表单提交参数详解.txt

    `ajaxForm()` 和 `ajaxSubmit()` 方法都是 JQuery Form 插件的一部分,它们可以用来处理表单的提交动作,实现 AJAX 异步提交。 - **`ajaxForm()` 方法**:此方法用于将表单的默认提交行为替换为 AJAX 提交行为。...

    使用AJAX提交Form表单

    二、使用AJAX提交Form表单的步骤 1. 创建XMLHttpRequest对象:在JavaScript中,我们首先需要创建一个XMLHttpRequest对象,这通常是异步的,意味着它不会阻塞页面的其他操作。 ```javascript var xhr = new ...

    jquery-form 异步提交表单

    在Web开发中,用户交互是关键的一环,而表单提交就是这种交互的重要组成部分。传统的HTML表单提交方式会刷新整个页面,用户体验不佳。为了解决这个问题,jQuery Form插件应运而生,它允许我们实现异步(Ajax)表单...

    jQuery扩展将复杂form表单转成json对象

    在标题和描述提到的场景中,我们需要创建一个jQuery扩展,将复杂的form表单数据转换为JSON对象。这通常涉及到遍历表单元素,获取它们的值,并构建JSON对象。以下是一个简单的示例: ```javascript (function($) { ...

    Ajax使用jQuery提交表单 文件

    在这个“Ajax使用jQuery提交表单 文件”中,我们将探讨如何利用jQuery实现Ajax提交表单,从而实现异步数据传输,提高用户体验。 首先,我们需要理解jQuery中的Ajax函数`$.ajax()`。这是一个核心函数,可以进行各种...

    ajaxForm插件

    AjaxForm插件基于jQuery库,它监听表单的submit事件,当用户点击提交按钮时,不刷新整个页面,而是通过AJAX方式将表单数据发送到服务器。这样,用户可以继续在当前页面操作,而无需等待页面重载,提高了交互的流畅性...

    jquery ajaxfrom表单提交代码

    本篇文章将详细介绍如何使用jQuery的`ajaxForm()`方法来实现表单的Ajax提交。 首先,让我们理解`ajaxForm()`的基本用法。在HTML中,你需要有一个表单元素,例如: ```html &lt;form id="myForm" action="/submit" ...

    jQuery Ajax无刷新提交表单并执行邮件通知

    **jQuery与Ajax无刷新提交表单** 在网页开发中,jQuery和Ajax技术的结合使得用户交互体验得到了极大的提升。"jQuery Ajax无刷新提交表单并执行邮件通知"这个主题涉及了两个关键点:一是利用jQuery进行表单验证,二...

Global site tag (gtag.js) - Google Analytics