添加更多字段功能并根据第一个组合框填充第二个组合框,可以为所有行插入运行

时间:2016-03-17 03:13:03

标签: javascript php jquery combobox

我有jQuery PHP函数来添加更多字段。

HTML

<div class="faculty_row">
    <select name="search_category"  id="search_category_id">
    <option value="" selected="selected"></option>
    <?php
    $query = "SELECT * FROM t_category ORDER BY category_name ASC";
    $results = mysql_query($query);

    while ($rows = mysql_fetch_assoc(@$results))
    {?>
        <option value="<?php echo $rows['category_id'];?>"><?php echo $rows['category_name'];?></option>
    <?php
    }?>
    </select>

    <input type="text" name="message[]">
</div>

<a href="#" id="add_more">Add More</a>

JS

jQuery(document).ready(function($){
    $("#add_more").on('click', function(e){
    e.preventDefault(); // Prevent Default the event
    var clone = $(".faculty_row").eq(0).clone(); // clone only first item
    $("#faculty_wrapper").append(clone); // append it to our form
});

然后我有基于First Combobox的jQuery Populate Second Combobox

HTML

<select name="search_category"  id="search_category_id">
    <option value="" selected="selected"></option>
    <?php
    $query = "SELECT * FROM t_category ORDER BY category_name ASC";
    $results = mysql_query($query);

    while ($rows = mysql_fetch_assoc(@$results))
    {?>
        <option value="<?php echo $rows['category_id'];?>"><?php echo $rows['category_name'];?></option>
    <?php
    }?>
</select>

<span id="show_sub_categories" align="center">

JS

jQuery(document).ready(function($){
$('#loader').hide();
$('#show_heading').hide();

$('#search_category_id').change(function(){
    $('#show_sub_categories').fadeOut();
    $('#loader').show();
    $.post("get_chid_categories.php", {
        parent_id: $('#search_category_id').val(),
    }, function(response){

        setTimeout("finishAjax('show_sub_categories', '"+escape(response)+"')", 400);
    });
    return false;
});

function finishAjax(id, response){
$('#loader').hide();
$('#show_heading').show();
$('#'+id).html(unescape(response));
$('#'+id).fadeIn();
} 

function alert_id()
{
    if($('#sub_category_id').val() == '')
    alert('Please select a sub category.');
    else
    alert($('#sub_category_id').val());
    return false;
}

每个功能都完美运行。如何将2功能合并为1?因此,如果单击“添加更多”按钮,则可以在下一行运行基于First Combobox的填充Second Combobox。

0 个答案:

没有答案