Question

我在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);

    }

    }

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

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

<击>
真的需要吗？我应该使用＆lt;按钮＆gt; 标记或使用＆lt;输入＆gt; 标签？

~~点击提交时我应该使用一个函数，还是应该使用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>

I also made a JSFiddle to show you how it actually looks

我总结说我应该运行一个函数。但是，我怀疑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数据库时，代码将如何显示？

Answer 1

这与你想要实现的行动完全相关。如果您在点击时使用按钮submit，则会查找表单中的所有元素，并将其发送到格式为action的属性form的网址中get或post，这是自动的，因此如果您需要发送大量元素，则需要考虑使用submit。现在请记住，这不是ajax，所以你无法知道服务器中发生了什么。如果是一些元素，你可以捕获按钮的click事件并由选择器包装元素，然后通过ajax发送它。

注意

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

<强>更新

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

假设按钮输入提交

submit

Answer 2

不知何故，您需要将数据提交回服务器。您可以使用AJAX（使用其他jQuery方法）执行此操作 - 这可以选择允许您在单击“发送”后保持在同一页面上，或者您可以将其作为传统HTML表单执行 - 这将需要{{1}标记，<form>设置为您要发送到的网址。

提交选择菜单

2 个答案: