0

我在 jQuery Mobile 中使用代码来动态生成选择菜单，但在将数据传递到数据库时遇到了问题。菜单是使用append每个表单元素的方法生成的。这是一个简短的代码示例：

for (var i = 0; i < arr.length; i++) {
var r = arr[i];
console.log(r);
    name    = r.optionname;
    val     = r.optionvalue;
    nameid  = r.optionnameid;
    valueid = r.optionvalueid;
if ($("#prodAttributes_"+prodID+" select").is("[name*=" + name + "]")) {

var select = $("#prodAttributes_"+prodID).find("select[name*=" + name + "]");
var option = $("<option></option>");
    option.val(val);
    option.text(val);
    option.attr("id", valueid);
    select.append(option);
  } else {

var select = $("<select></select>");
    select.attr("name", name);
    select.attr("id", nameid);
var option = $("<option></option>");
    option.val(val);
    option.text(val);
    option.attr("id", valueid);
    select.append(option);
var label = $("<label></label>");
    label.attr("class", "select");
    label.attr("for", name);


    label.text(name);
    fieldset.append(select);
    myform.append(div);
    $(myform).appendTo("#prodAttributes_"+prodID);

    }

    }

我知道这不是最好的代码。

我遇到的问题是我不知道如何获取提交的数据。如果我应该使用表单标签，我很困惑。

真的需要吗？我应该使用<button>标签还是使用<input>标签？

单击提交时我应该使用一个函数，还是应该使用 jQuery 库中的一些东西？

此处生成的 HTML：

<div id="prodAttributes_2">
<form id="attributesubmit">
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<div role="heading" >Options:</div>

<select name="Memory" id="4">
<option value="16 mb" id="3">16 mb</option>
<option value="32 mb" id="4">32 mb</option>
</select>


<select name="Model" id="3">
<option value="Premium" id="6">Premium</option>
<option value="Deluxe" id="7">Deluxe</option>
</select>

</fieldset>
</div>
<input type="button" id="submitme" value="send" />
</form>
</div>

我还制作了一个 JSFiddle 来向您展示它的实际外观。

我得出结论，我应该运行一个函数。但是，我怀疑serialize()做我想要的，所以像：

$("#submitme").live('click', function(){
$('select').each(function() {
var selectedOption = $(this).find('option:selected');

alert('Value: ' + selectedOption.val() + ' Text: ' + selectedOption.text());
});

var formData = '<p>something generated</p>';
var newPage = $('<div data-role="page" data-url="test"><div data-role="header"><h1>test</h1></div><div data-role="content">'+formData+'</div></div');
    newPage.appendTo( $.mobile.pageContainer );
    //append it to the page container
    $.mobile.changePage(newPage);

        });

但是我仍然需要所选元素本身的名称/ID。准备好插入 SQL 数据库时，代码会是什么样子？

4

2 回答 2

1

这与您想要实现的操作完全相关。如果您在单击时使用按钮submit，它将查找表单中的所有元素并将其发送到格式中的属性action的url，或者这是自动的，所以如果您需要发送很多您需要考虑使用的元素。现在请记住，这不是 ajax，因此您无法知道服务器中发生了什么。如果是几个元素，您可以捕获按钮的单击事件并通过选择器包装元素，然后通过 ajax 发送它。formgetpostsubmit

笔记

可以绑定submit按钮类型的事件，submit然后发送一个ajax调用来控制服务器的响应

更新

我不太确定您想要完成什么，但这里是您如何获取和处理绑定提交按钮的表单中的所有字段以避免为表单中的每个 html 元素执行选择器

假设它是输入的按钮提交

$('form#attributesubmit').live('submit', function (){

     $(this).serialize() -->> this give you all the fields and values of the form
});
于 2011-12-27T18:00:17.160 回答
0

不知何故，您需要将数据提交回服务器。您可以使用 AJAX（使用额外的 jQuery 方法）来执行此操作 - 这可以选择允许您在单击“发送”后留在同一页面上，或者您可以将其作为传统的 HTML 表单来执行 - 这需要一个<form>标签，带有action设置为您要发送到的 URL。

于 2011-12-27T18:01:32.217 回答