Ajax和多形式的投入

我工作在新系统上和我停留在使用jQuery + AJAX点，并得到它正常工作与工作发生的页面上的其他东西。Ajax和多形式的投入

基本上页面提交报价，并在页面上，只要你想，你可以添加尽可能多的报价项目。当有人点击新的项目时，它会运行下面的代码，以获取隐藏元素的值，并将其用于所有新元素ID中，以便保持它们的唯一性。

新产品代码：

function addFormField() { 
     var id = document.getElementById("field_id").value; 
     $("#products").append(" 
<table width='600' cellpadding='5' cellspacing='0' class='Add_Products' id='row" + id + "'> 
    <td width='250' class='left'> 
     <label>Select Product Category</label> 
    </td> 
    <td class='right' > 
     <label><select name='ProductCategory' id='ProductCategory'> 
     <?php foreach($categories as $key=>$category){ 
       echo "<option value=".$key.">".$category."</option>"; 
      } 
      ?> 
     </select> 
     </label> 
    </td> 
    </tr> 
    <tr> 
    <td width='250' class='left'> 
     <label>Select Product Template</label> 
    </td> 
    <td class='right' > 
     <label> 
     <select name='data[QuoteItem][" + id + "][product_id]' id='QuoteItem" + id + "product_id'></select> 
      </label> 
    </td> 
    </tr> 
    <tr > 
    <td class='left'>Name</td> 
    <td class='right'> 
      <label> 
      <input name='data[QuoteItem][" + id + "][name]' type='text' id='QuoteItem" + id + "name' size='50' /> 
      </label> 
     </td> 
    </tr> 
    <tr > 
     <td class='left'> 
      Price (ex GST) 
     </td> 
     <td class='right'> 
      <input type='text' name='data[QuoteItem][" + id + "][price]' id='QuoteItem" + id + "price' onchange='totalProductPrice();' class='quote-item-price' /> 
     </td> 
    </tr> 
    <tr> 
     <td class='left'> 
      Description 
     </td> 
     <td class='right'> 
      <label> 
       <textarea name='data[QuoteItem][" + id + "][description]' cols='38' rows='5' id='QuoteItem" + id + "description'> 
       </textarea> 
      </label> 
     </td> 
     </tr> 
     <tr> 
     <td> 
      <a href='#' onClick='removeFormField(\"#row" + id + "\"); return false;'>Remove</a> 
     </td> 
     </tr> 
    </table> 
"); 


     $('#row' + id).highlightFade({ 
      speed:1000 
     }); 

     id = (id - 1) + 2; 
     document.getElementById("field_id").value = id; 
    }

我想要做的下一件事就是安装使用jQuery在被选择时会要求相应的数据和填充产品的框，但我无法弄清楚如何得到一个AJAX查询该元素集的ID以确保填充正确的下拉框，并且确保检测到正确的框的onchange。

我用尽像加了ID的下拉框的ID的方法，但随后onchagne不起作用。

我的jQuery Ajax代码是低于retreives产品

$(function(){ 
     $("select#ProductCategory").change(function(){ 
     var url = "productList/" + $(this).val() + ""; 
     var id = $("select#ProductCategory").attr('name'); 
     $.getJSON(url,{id: $(this).val(), ajax: 'true'}, function(j){ 
      var options = ''; 
     options += '<option value="0">None</option>'; 
      $.each(j, function(key, value){ 
     options += '<option value="' + key + '">' + value + '</option>'; 
      }) 
      $("select#QuoteItem" + id + "product_id").html(options); 
     }) 
     }) 
    })

有关生命的清单我能不知道这一点，所以如果任何人都可以阐明的最佳途径一些光做到这一点，将是巨大。

另外，如果我需要进一步澄清，让我知道，因为IM strugling解释。

在此先感谢

来源

2010-02-08 kwhohasamullet

我已经在我的项目类似的功能。在这里，我如何做到这一点：

我有一个全局变量，从0开始，每一次新的领域增加增加：

var num = 0; 

jQuery(function($){ 
    $("#add_field").click(function(){ 
    num++; 
    //here add new field, with id contains 'num' 
    }); 
});

，使其更容易调试，你应该用一个简单的元素开始，测试它，因此它没有错误，并为其添加更多字段。

要通过AJAX提交表单，使用jQuery form plugins，所以你不需要手动添加所有字段在提交表单Ajax代码。

来源

2010-02-09 01:43:32

Ajax和多形式的投入

回答

相关问题