如何在动态创建的行

时间:2016-07-18 09:01:14

标签: javascript php html

当用户从下拉列表中选择频道名称时,我想将其频道类型设置为动态创建的行中的文本框。我在addRow事件上创建多行。它工作正常

这是HTML代码

 <table id="dataTable"  border="1" class="table table-striped table-bordered" >


            <tr>
                    <td><INPUT type="checkbox" name="chk[]"  data-parsley-errors-container="#checkbox-errors" /></td>
                    <td>
                            <SELECT name="channel_name[]" onclick ="get_type(this)"; class='channelname'>
                                    <option value="">Select...</option>
                                  <?php foreach($channel_list as $row) {
                                            $channelid = $row['channelid'];
                                            $channelname = $row['channelname'];?>
                                    <OPTION value='<?php echo $channelid ?>'><?php echo $channelname?></OPTION>

                            <?php } ?>
                            </SELECT>
                    </td>
                    <td><INPUT type="text" name="type[]" class="channeltype"/></td>
                     <td><INPUT type="text" name="partner_share[]"/></td>
            </tr>

    </table>

Javascript代码:

function get_type()
{
    $(".channelname").live("change", function() {

            var channel_id = $(this).find("option:selected").attr("value");
            $.ajax({
                    type: "POST",
                    url: '<?php echo base_url(); ?>index.php/partner/get_channel_type',
                    data: 'channelid='+channel_id,
                    async:   false
                     }).done(function( data1 ) {

                    if(data1){
                            alert(data1);
                            //$(this).closest('tr').children('td.type').val(data1);
                            //$(this).closest('tr').find('.type').val(data1);
                            $(this).closest("tr").find('input[name="channeltype[]"]').val(data1);
                            //$(this).closest("tr").find('input[name="usage_unit[]"]').val(ui.item.usage_unit);


                    }else{
                            alert("Channel type is not defined");

                    }


            });
    });
}

2 个答案:

答案 0 :(得分:1)

没有输入名称为channeltype[]的行:

$(this).closest("tr").find('input[name="channeltype[]"]').val(data1);

应该是:

$(this).closest("tr").find('input[name="type[]"]').val(data1);

因为频道类型输入名称为type[],如下所示:

<td><INPUT type="text" name="type[]" class="channeltype"/></td>

您必须保存jquery实例$(this),因为它在成功回调中会有所不同:

 ...
 var channel_id = $(this).find("option:selected").attr("value");
 var _this = $(this); //Save current object

 $.ajax({
 ...

然后在你的回调中使用它:

...
_this.closest("tr").find('input[name="type[]"]').val(data1);
...

希望这有帮助。

答案 1 :(得分:0)

缓存通道= $ {this}。使用ajax响应中的通道

  function get_type()
    {
        $(".channelname").live("change", function() {
                var channel = $(this);
                var channel_id = $(this).find("option:selected").attr("value");
                $.ajax({
                        type: "POST",
                        url: '<?php echo base_url(); ?>index.php/partner/get_channel_type',
                        data: 'channelid='+channel_id,
                        async:   false
                         }).done(function( data1 ) {

                        if(data1){
                                alert(data1);
                                //$(this).closest('tr').children('td.type').val(data1);
                                //$(this).closest('tr').find('.type').val(data1);
                                channel.closest("tr").find('input[name="channeltype[]"]').val(data1);
                                //$(this).closest("tr").find('input[name="usage_unit[]"]').val(ui.item.usage_unit);


                        }else{
                                alert("Channel type is not defined");

                        }


                });
        });
    }