相关疑难解决方法(0)

如何从HTML表单中获取键/值数据集

我只是在寻找一种方式来获得所有的值<form>.

我在网上搜索了一会儿,磕磕绊绊FormData,这似乎正是我正在寻找的.

但是它的API 在任何浏览器上都不可用,所以我需要一个替代方案.


在我的具体情况下我需要的是键/值对的对象.例如:

<form>
  <input type="text" name="firstname" value="John" />
  <input type="text" name="surname" value="doe" />
  <input type="email" name="email" value="" />
  <input type="radio" name="gender" value="male" />
  <input type="radio" name="gender" value="female" />
</form>
Run Code Online (Sandbox Code Playgroud)

对象应该是:

{
  firstname: "John",
  surname: "doe",
  email: "",
  gender: ""
}
Run Code Online (Sandbox Code Playgroud)

编辑:上面只是一个例子,它不仅应该<input>与其他标签一起工作(例如<select>,<textarea>等等......甚至<input type="file">应该支持).

html javascript forms html5 form-data

40
推荐指数
2
解决办法
3万
查看次数

来自不是表单的元素的jQuery serialize/serializeArray

关于这是否可行,我还没有找到具体的答案,但似乎应该......

我想序列化div中包含的所有输入元素.我不能使用表单,因为它将嵌套在另一个表单中.然后我会得到值并通过ajax发布它们.

这是我正在玩的jsFiddle示例:

http://jsfiddle.net/9uyz5/

如果我将root更改为a它按预期工作.

谢谢你的帮助.

我从另一个问题修改了jsfiddle:

/sf/answers/83041661/

jquery

35
推荐指数
3
解决办法
2万
查看次数

什么更好:Json或XML(PHP)

我用PHP操作一些数据,我可以选择Json和XML.但我不知道该选择什么,我从未与其中一个人合作过.所以我想要最简单的一个.

另外我想知道是否有好的类可以使解析(XML或Json)更容易.

我主要关注易用性而不是速度和规模.

php xml json

31
推荐指数
3
解决办法
2万
查看次数

使用搜索参数获取Backbone集合

我想用Backbone.js.实现一个搜索页面.搜索参数取自简单形式,服务器知道解析查询参数并返回结果的json数组.我的模型或多或少看起来像这样:

App.Models.SearchResult = Backbone.Model.extend({
    urlRoot: '/search'
});

App.Collections.SearchResults = Backbone.Collection.extend({
    model: App.Models.SearchResult
});

var results = new App.Collections.SearchResults();
Run Code Online (Sandbox Code Playgroud)

我希望每次执行时results.fetch(),搜索表单的内容也会随GET请求一起序列化.有没有一种简单的方法来添加它,或者我是以错误的方式执行它,并且可能应该手动编码请求并从返回的结果创建集合:

$.getJSON('/search', { /* search params */ }, function(resp){
    // resp is a list of JSON data [ { id: .., name: .. }, { id: .., name: .. }, .... ]
    var results = new App.Collections.SearchResults(resp);

   // update views, etc.
});
Run Code Online (Sandbox Code Playgroud)

思考?

search query-string backbone.js

21
推荐指数
4
解决办法
4万
查看次数

将表单数据转换为JSON对象

我试图将HTML表单数据转换为JSON对象,我有这个线程,但我不知道为什么它不适合我.我使用以下代码.

<form id="myform" action="" method="post">
    <div class="form-field">
        <label for="title">Title</label>
        <input name="title" id="title" type="text" value="" size="40" aria-required="true">
    </div>
    <div class="form-field form-required">
        <label for="your-name">Your Name</label>
        <input name="yourName" id="yourName" type="text" value="" size="40" aria-required="true">
    </div>
    <div class="form-field">
        <label for="contact-no">Contact No:</label>
        <input name="contact" id="contact" type="text" value="" size="40" aria-required="true">
    </div>
    <div class="form-field">
        <label for="description">Description:</label>
        <textarea name="description" id="description" rows="1" cols="40" aria-required="true"></textarea>
    </div>
    <div class="form-field">
        <label for="email">Email:</label>
        <input name="email" id="email" type="text" value="optional" size="40" aria-required="true">
    </div>
    <div class="form-field">
        <label for="city">City:</label>
        <input name="city" id="city" …
Run Code Online (Sandbox Code Playgroud)

html forms jquery json

20
推荐指数
2
解决办法
6万
查看次数

在jQuery对话框中的MVC中常用的方法

似乎有几种方法可以将jQuery对话框与ASP.NET MVC集成.是否有一种特定的方法成为普遍接受的最佳实践方法?

作为一个例子:我有一个列表页面,点击任何列出的项目的"编辑"在jQuery对话框中打开一个表单,填充项目的详细信息.用户编辑详细信息并单击"保存".如果保存在服务器端成功,则关闭对话框并使用新数据重新构建列表.如果在服务器端保存失败,则对话框保持打开状态并向用户显示错误消息.

  1. No-JSON方法:每个"编​​辑"链接都是"编辑"控制器操作的HREF.该控制器操作构建一个与"列表"视图相同的视图,此外它还包括一个部分操作来构建编辑表单,填充它,并定义javascript以将其作为jquery对话框弹出."保存"是一个形式的帖子; 如果成功,它会将重定向操作返回到列表页面.如果失败,它将重建整个页面(包括在对话框中弹出的表单),同时显示错误消息.
  2. 全JSON方法:列表页面呈现一个空的编辑表单(隐藏),准备弹出一个对话框."编辑"链接调用本地javascript,它执行ajax请求以获取完整对象(我定义了一个控制器,它将完整对象作为JsonResult返回).成功时,它使用对象的数据填充编辑表单并打开对话框."save"链接调用本地javascript,它将表单数据捆绑到json对象中,并使用该json对象作为有效负载调用post操作(我定义了一个控制器,它需要该对象,尝试保存,并返回一个指示成功的JsonResult /失败+ errorMessages).来自ajax请求的成功回调会评估返回的对象,并在仍然打开的jquery对话框中显示错误消息,或者关闭对话框并重新加载"list"页面以获取列表中的新数据.
  3. [编辑] Ajax-HTML方法:刚刚看到这个SO讨论描述了另一种方法."编辑"调用本地javascript,它执行ajax发布以获取对话框的完整HTML(我会编写一个返回部分视图的控制器:完全填充的表单).它将返回的HTML呈现为jquery对话框,并且还"重新连接"表单提交以执行表单内容的ajax-post(我将编写一个httpPost控制器,与上面的#2相同).成功回调会评估响应并填充错误消息或关闭对话框.
  4. 我还没有想过其他一些很酷的方法?

选项1似乎更符合"纯粹的"ASP.NET MVC.但是,它似乎具有大的HTTP有效负载(因为我们在每个请求时将整个页面发送回浏览器),并且服务器端性能较慢(因为我们在每个请求上重新构建列表).

选项2似乎与更现代的基于Ajax的Web应用程序(更小的HTTP有效负载,更细粒度的操作)更加一致.但是,似乎许多控制器都是JSON控制器,我将编写大量客户端代码来编组来自JSON对象的数据到/从表单字段,显示错误消息等.它似乎也像我我会错过许多很酷的MVC功能,比如EditorFor()和ValidationMessageFor().它只是"感觉"就像我正在使用MVC系统而不是它.

[编辑:添加选项3]选项3似乎是1和2之间的混合.我使用"纯"MVC方法来构建和填充表单,并返回完整格式的HTML FORM标记.将HTML返回到ajax请求感觉很奇怪,因为它很冗长,但我可以克服它.后期操作很好,紧凑的JSON比ajax"感觉"更好.但是,不幸的是,有效负载对象是FormCollection而不是真正的viewmodel对象.看起来我可以使用一些MVC便利(EditorFor())而不是其他(ValidationMessageFor()).

我正在寻找"正确"的方式来做到这一点,而不仅仅是最快的方式来破解它.是的,是的,我知道没有普遍的"正确"方式.但我确信有一些明显错误的方法,我想避免它们.

我在ASP.NET/C#中很有经验,但我对MVC很新.在此先感谢您的帮助!

[编辑] - 杰出的回答 - 我希望我可以奖励多个答案/赏金,因为我发现几个回复非常有用.但是,由于我不能,我将最高投票的答案标记为答案.再次感谢所有受访者!

asp.net ajax asp.net-mvc asp.net-mvc-3

18
推荐指数
1
解决办法
3265
查看次数

jQuery:如何阻止AJAX函数转义用于POST数据的JSON字符串

我需要将表单中的所有输入序列化为JSON字符串.
这篇文章的帮助下,我可以成功创建一个有效的字符串,如下所示:

{"input01":"value01","input02":"value02","input03":"value03"}
Run Code Online (Sandbox Code Playgroud)

但是,当我尝试使用jQuery的Ajax函数将字符串用于POST数据时,似乎在字符串中添加了反斜杠,导致使用GET而不是POST发送JSON字符串.加载的PHP页面返回一个$_GET数组:

[{\"input01\":\"value01\",\"input02\":\"value02\",\"input03\":\"value03\"}] =>
Run Code Online (Sandbox Code Playgroud)

alert()在使用AJAX函数之前,我已经测试了JSON字符串,以确认结构是否正确.
此外,如果我只是手动输入有效的JSON字符串,AJAX会正确发布数据.

我的代码如下:

var dataJSON = $.toJSON($('#form').serializeObject());
alert(dataJSON);

$.ajax({
    type: "POST",
    url: "ajax.php",
    data: 'Query01=01&Query02=02',
    dataType: 'json',
    success: function(data){
       if (data==1){
         $('#wrap').load('ajax.php',dataJSON);
       }
    }
});
Run Code Online (Sandbox Code Playgroud)

javascript php ajax jquery json

12
推荐指数
2
解决办法
2万
查看次数

使用Backbone.js将表单输入序列化为JSON

我正在开发RESTful应用程序 - 我在服务器端使用Java,在前端使用Backbone.2将通过JSON进行通信.

我的应用程序有很多表单,我想:

  1. 将表单输入序列化为JSON
  2. 将JSON发送到服务器

我的问题:

  1. 将表单输入序列化为JSON的最佳方法是什么?也许只有Backbone解决方案?
  2. 表单输入序列化为JavaScript对象后 - 将JSON发送到服务器的最佳方法是什么?

我的代码到目前为止:

Javascript和Backbone

$(function(){
    $.fn.serializeObject = function()
    {
        var o = {};
        var a = this.serializeArray();
        $.each(a, function() {
            if (o[this.name] !== undefined) {
                if (!o[this.name].push) {
                    o[this.name] = [o[this.name]];
                }
                o[this.name].push(this.value || '');
            } else {
                o[this.name] = this.value || '';
            }
        });
        return o;
    };

    //Model 
    var SignupForm = Backbone.Model.extend();

    //View
    var SignupView = Backbone.View.extend({
        el: '.signupForm',
        events: {
            'click input.submit': 'getStatus'
        },
        getStatus: function(event){
            var data = …
Run Code Online (Sandbox Code Playgroud)

javascript jquery serialization json backbone.js

11
推荐指数
2
解决办法
1万
查看次数

使用contentType调用Ajax:'application/json'无效

我有一个ajax调用,它将表单数据发送到php函数.由于我阅读了很多使用contentType: 'application/json'最佳实践,我也想尝试一下.但不幸的是,当我使用它时,我的脚本不会返回任何内容.如果我删除它,脚本会执行它应该执行的操作.

你知道原因是什么以及为什么?谢谢!

$('#Form').submit(function(e) {
            e.preventDefault();

            var content = $(this).serialize() + "&ajax=1";

            $.ajax('app/class/controller/contactForm.php', {
              type: "POST",
              //contentType: 'application/json',
              dataType: 'json',
              data: content,
              success: function(result) {
                  console.log(result);
              }
            });
        })
Run Code Online (Sandbox Code Playgroud)

和我的PHP:

if(isset($_POST['ajax']) && $_POST['ajax'] === '1') {
    echo json_encode(validateForm($_POST));
}
Run Code Online (Sandbox Code Playgroud)

php ajax jquery json content-type

11
推荐指数
1
解决办法
3万
查看次数

带有Spring + REST Web服务的@RequestBody或@ModelAttribute

我正在使用Spring 3.1为iPhone和Android应用程序创建Restful网站和Web服务.在我的应用程序中,我使用Spring Message Convertors(org.springframework.http.converter.json.MappingJacksonHttpMessageConverter)将JSON转换为Java对象,反之亦然.

我的目标是JSP页面,Iphone/Andois app应该只使用单个控制器方法(相同的URL).

我使用Spring表单标签进行从JSP到控制器的对象绑定,@ModelAttribute如下所示.

@RequestMapping(value = "reset-password", method = RequestMethod.POST)
public ModelAndView resetPassword(@ModelAttributeForgot forgotPassword,
     HttpServletRequest request) { 

     System.out.println("data recived=="+forgotPassword.getNewPassword());
 }
Run Code Online (Sandbox Code Playgroud)

但是,如果数据是从iPhone/Android应用程序发布的,那么同样的情况就不适用了,结果是:

recived = = null;

所以为了克服这个问题,我@RequestBody在地方使用了注释@ModelAttribute.

所以我的控制器如下所示:

@RequestMapping(value = "reset-password", method = RequestMethod.POST)
public ModelAndView resetPassword(@RequestBody Forgot forgotPassword,
    HttpServletRequest request) { 

    System.out.println("data recived=="+forgotPassword.getNewPassword());
}
Run Code Online (Sandbox Code Playgroud)

它的工作原理,我得到的结果是:

收到的数据== somedata;

但是@RequestBody然后在JSP页面上不能使用spring表单,并且数据不会转换为对象而且我得到了null值.

  1. 我不能使用@RequestBody注释以JSP形式的弹簧形式标签以JSON的形式发布数据吗?
  2. 有没有什么方法可以使用我可以通过使用单个控制器方法(@ModelAttribute或@RequestBody)从我的JSP表单以及从我的手机App发布数据.

编辑:

在写String到位Bean类的,我能够获得纯文本格式的内容,如下图所示:

@RequestMapping(value = "reset-password", method = RequestMethod.POST)
public …
Run Code Online (Sandbox Code Playgroud)

rest spring spring-mvc

10
推荐指数
1
解决办法
2万
查看次数