如何在asp.net中为动态生成的文本框添加自动完成json [英] How to add auto complete json for dynamically generated textboxes in asp.net

问题描述

我正在尝试在我的aspx页面中生成动态html文本框，并且在这些文本框中我想使用自动完成工具添加值。我尽力这样做。我几乎尝试了每个问题的stackoverflow的答案。但是这里没有任何工作我的脚本会动态生成新的文本框

I am trying to generate dynamic html textboxes in my aspx page and on these textboxes i want to add the value using autocomplete facility. I try my best to do so. I try almost every single question's answer of stackoverflow. But nothing is working here my script which generate new textbox dynmacally

<script type="text/javascript">
    $(document).ready(function () {

        var counter = 2;

        $("#addButton").click(function () {

            if (counter > 5) {
                alert("Limit Exceeds");
                return false;
            }

            var newTextBoxDiv = $(document.createElement('div'))
         .attr("id", 'TextBoxDiv' + counter);

//            newTextBoxDiv.after().html('<label>Textbox #' + counter + ' : </label>' +
//        '<input type="text" name="textbox' + counter +
//        '" id="textbox' + counter + '" value=""  class="auto">');

            newTextBoxDiv.after().html('<div class="fields-left"><label> Leaving from</label><input type="text" name="textbox' + counter + '" id="textbox' + counter + '" class="auto"/>  </div><div class="fields-right"> <label> Going to</label>  <input type="text" name="textbox' + counter + '" id="textbox' + counter+1 + '" class="auto"/> </div>');
           newTextBoxDiv.appendTo("#TextBoxesGroup");


            counter++;
        });

        $("#removeButton").click(function () {
            if (counter == 1) {
                alert("No more textbox to remove");
                return false;
            }

            counter--;

            $("#TextBoxDiv" + counter).remove();

        });


    });


</script>

Html代码

Html code

<div id="TextBoxDiv1" class="fields" >
          <div id="TextBoxesGroup">
          </div>
     </div>
          <input type='button' value='Add Button' id='addButton'/>
 <input type='button' value='Remove Button' id='removeButton'/>
           </div>

我正在尝试使用这个json代码来获取第一个文本框的数据自动生成。首先，我认为为每个动态生成的文本框编写此脚本，但这个过程将是如此冗长和错误的方式来做这件事。但这对我不起作用

and I am trying this json code for fetching data for very first textbox that generate automatically. First I think for write this script for everytextbox which generate dynamically but this process will be so lengthy and wrong way to do this thing. But this is not working for me

<script type="text/javascript">
              $(document).ready(function () {
                  SearchText2();
              });
              function SearchText2() {
                  $("#textbox2").autocomplete({
                      source: function (request, response) {
                          $.ajax({
                              type: "POST",
                              contentType: "application/json; charset=utf-8",
                              url: "Home.aspx/GetAutoCompleteData",
                              data: "{'code':'" + document.getElementById('textbox2').value + "'}",
                              dataType: "json",
                              success: function (data) {
                                  response(data.d);
                              },
                              error: function (result) {
                                  alert("Error");
                              }
                          });
                      }
                  });
              }
</script>

请专家告诉我为什么这个json不能为我工作



谢谢

Please experts tell me why this json is not working for me

Thanks

推荐答案

（ document ）。ready（功能（）{

var counter = 2 ;

(document).ready(function () { var counter = 2;

（ ＃addButton）。点击（ function （）{

if （counter> 5 ）{
alert（ 限制超过 ）;
return false ;
}

var newTextBoxDiv =

("#addButton").click(function () { if (counter > 5) { alert("Limit Exceeds"); return false; } var newTextBoxDiv =

（ document .createElement（' div'））
.attr（ id，' TextBoxDiv' + counter）;

// newTextBoxDiv.after（）。html（'< label> Textbox＃' + counter +'：< / label>'+
// '<输入type =textname =textbox'+ counter +
// 'id =textbox'+ counter +'value =class =auto>'）;

newTextBoxDiv.after（）。html（' < div class =fields-left>< label>离开< / label>< input type =textname = textbox' + counter + ' id =textbox' + counter + ' class =auto/>< / div>< div class =fields-right>< ;标签>转到< / label>< input type =textname =textbox' + cou nter + ' id =textbox' + counter + 1 + ' class =auto/> < / DIV>'）;
newTextBoxDiv.appendTo（ ＃TextBoxesGroup）;


counter ++;
}）;

(document.createElement('div')) .attr("id", 'TextBoxDiv' + counter); // newTextBoxDiv.after().html('<label>Textbox #' + counter + ' : </label>' + // '<input type="text" name="textbox' + counter + // '" id="textbox' + counter + '" value="" class="auto">'); newTextBoxDiv.after().html('<div class="fields-left"><label> Leaving from</label><input type="text" name="textbox' + counter + '" id="textbox' + counter + '" class="auto"/> </div><div class="fields-right"> <label> Going to</label> <input type="text" name="textbox' + counter + '" id="textbox' + counter+1 + '" class="auto"/> </div>'); newTextBoxDiv.appendTo("#TextBoxesGroup"); counter++; });

这篇关于如何在asp.net中为动态生成的文本框添加自动完成json的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！