Question

我在包含结构的页面上有2个表单

<div id="tabs-7">
    <form action="/admin/languages" id="1" class="mainForm" method="POST">
        <fieldset>
            <div class="widget">

                <input type="hidden" maxlength="40"class="autoF" name="base" id="base" value="<?php echo base_url(); ?>" />
                <input type="hidden" maxlength="40"class="autoF" id="lang_id" name="lang_id" value="1" />


                <div class="rowElem">
                    <label>Calender</label> 
                    <div class="rowElem noborder" >
                        <label>Date:</label>
                        <div class="formLeft">
                            <input type="text"  name="date" class="datepicker date" value="<?php echo isset($data['1']['date']['text']) ? $data['1']['date']['text'] : ""; ?>" />
                        </div>
                    </div>
                    <label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Note:</label>
                    <div class="formLeft">


                        <?php
                        if (!empty($data['1']['calender_contents'])) {
                            $text = preg_replace('/\s+/', ' ', $data['1']['calender_contents']['text']);
                        }
                        ?>
                        <textarea name="calender_contents"  class="auto limit calender_contents" style="min-width: 600px;max-width: 600px;min-height:80px;max-height: 80px;"><?php echo isset($data['1']['calender_contents']['text']) ? $text : ""; ?></textarea>
                    </div>
                    <div class="rowElem "><input type="button" value="Add Note" class="blueBtn left addnote"></div>
                </div>


                <div class="rowElem "><input type="submit" value="Save" class="greenBtn right"></div>

            </div>
        </fieldset>
    </form>
</div>

<div id="tabs-8">
    <form action="/admin/languages" id="2" class="mainForm" method="POST">
        <fieldset>
            <div class="widget">

                <input type="hidden" maxlength="40"class="autoF" name="base" id="base" value="<?php echo base_url(); ?>" />
                <input type="hidden" maxlength="40"class="autoF" id="lang_id" name="lang_id" value="2" />


                <div class="rowElem">
                    <label>Calender</label> 
                    <div class="rowElem noborder" >
                        <label>Date:</label>
                        <div class="formLeft">
                            <input type="text"  name="date" class="datepicker date" value="<?php echo isset($data['2']['date']['text']) ? $data['2']['date']['text'] : ""; ?>" />
                        </div>
                    </div>
                    <label>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Note:</label>
                    <div class="formLeft">


                        <?php
                        if (!empty($data['2']['calender_contents'])) {
                            $text = preg_replace('/\s+/', ' ', $data['1']['calender_contents']['text']);
                        }
                        ?>
                        <textarea name="calender_contents" class="auto limit calender_contents" style="min-width: 600px;max-width: 600px;min-height:80px;max-height: 80px;"><?php echo isset($data['2']['calender_contents']['text']) ? $text : ""; ?></textarea>
                    </div>
                    <div class="rowElem "><input type="button" value="Add Note" class="blueBtn left addnote"></div>
                </div>


                <div class="rowElem "><input type="submit" value="Save" class="greenBtn right"></div>

            </div>
        </fieldset>
    </form>
</div>

和javascript：

 $(".datepicker").datepicker({
        defaultDate: +7,
        autoSize: true,
        appendText: '(yyyy-mm-dd)',
        dateFormat: 'yy-mm-dd',
        onClose: function(dateText, inst) {
           var form = $(this).closest("form");
             var formID = $(form).attr("id");
             console.log(formID);
             if(formID == "1"){
                  formID = 1;
                   }
                   else{
                     formID = 2;  

                   }
            var lang_id = formID;
            var date = $(".date").val();
            console.log(lang_id);
            console.log(date);

            $.ajax({
                type: 'POST',
                url: "/admin/getnote",
                dataType: "json",
                data: {"date": date, "lang_id": lang_id},
                success: function(data) {

                    console.log(data.arr[0]);

                     if(data.arr[0] != undefined){
                    $('.calender_contents').val(data.arr[0].note);
                    $('.date').val(data.arr[0].date);
                     }
                      else {
                         $('.calender_contents').val("");                         
                     }
                }

            });

        }
    });

我能够从第一个选项卡中获取数据库中的值，即tab 7 fine和value 但是当使用第二种形式的日期选择器到它的值时，也会显示在第一个表中，所以我正在寻找一些建议，如何将$(this).closest("form");与这些字段结合起来

$('.calender_contents').val(data.arr[0].note);
                        $('.date').val(data.arr[0].date);

这样我就可以在特定的表单字段中获得价值。谢谢。

Answer 1

您选择#calendar_contents。如果对2个元素使用相同的“id”，首先你做错了（id必须是唯一的），然后jQuery只会返回第一个具有请求id的元素。

尝试使用课程并“找到”您正在使用的标签。

Answer 2

您不能在同一页面上拥有具有相同ID的html元素，即使它们采用不同的形式。 id属性在整个页面上必须是唯一的

从多个表单中获取值并根据表单ID显示在相应的字段中

2 个答案: