Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

javascript create textbox asp

Posted on 2016-08-18
12
Medium Priority
?
195 Views
Last Modified: 2016-09-02
how to create asp:TextBox programatically in javascript!!!!
0
Comment
Question by:pamela rizk
  • 7
  • 5
12 Comments
 

Author Comment

by:pamela rizk
ID: 41760654
any newssss
0
 
LVL 60

Expert Comment

by:Julian Hansen
ID: 41760694
an asp:textbox - is just an <input> element
You can do it like this
HTML
    <form action="reflect.php" method="post">
      <p>New inputs will appear below when you click this button <button id="add" class="btn btn-primary">Add</button></p>
      <div id="inputs"></div>
      <button type="submit" class="btn btn-default">Submit</button>
	</form>

Open in new window

JQuery
<script src="http://code.jquery.com/jquery.js"></script>
<script>
$(function() {
  $('#add').click(function(e) {
    // PREVENT DEFAULT BUTTON BEHAVIOUR (submit)
    e.preventDefault();

    //FIND OUT HOW MANY input's WE HAVE ALREADY
    var next = $('form input').length + 1;

    // CREATE UNIQUE NAME AND ID
    var name = 'input_' + next;

    // CREATE THE NEW INPUT WITH name AND id
    var newinp = $('<input/>').attr({'name':name, 'id' : name});

    // APPEND THE NEW INPUT TO THE inputs <div> INSIDE 
    // ITS OWN <div> SO EACH APPEARS ON ITS OWN LINE
    $('#inputs').append(
      $('<div/>').append(newinp)
    );

    // SET FOCUS TO NEW input
    newinp.focus();
  });
});
</script>

Open in new window

Working sample here
0
 

Author Comment

by:pamela rizk
ID: 41760718
can i attach a autocomplete event for it??
0
Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
LVL 60

Expert Comment

by:Julian Hansen
ID: 41760793
Yes - you can

Add just before the last line
newinp.autocomplete({
   /* your options here */
});
newinp.focus();

Open in new window

0
 

Author Comment

by:pamela rizk
ID: 41760825
woudl you pleae give me an exampl ebecause i am trying teh below but it is not working
txt.autocomplete({
                    //Begin on source
                    source: function (request, response) {
                   <%--   var m_Category = $("#<%=hdn_Category_File.ClientID%>").val();
                     var m_SubCategory = $("#<%=hdn_SubCategory_File.ClientID%>").val();
                    var m_SessionId = $("#<%=hdn_SessionID_File.ClientID%>").val();
                    var m_CongrpStr = $("#<%=hdn_ConGrpStr_File.ClientID%>").val();
                    var m_TransFilePathName = $("#<%=hdn_trans_File.ClientID%>").val();
                      var m_txtSearch_File = txt.value;//added by serena
                    var searchFor;
                    searchFor = CodifyPrefix(m_txtSearch_File);
                    $.ajax({
                        url: '<%=ResolveUrl("AutoCompleteForFile.asmx/RetrieveFileData")%>',
                        data: "{ 'prefixText': '" + searchFor + "' , 'm_Category': '" + m_Category + "','m_SubCategory':'" + m_SubCategory + "','m_SessionId': '" + m_SessionId + "', 'm_ConGrpStr': '" + m_CongrpStr + "', 'm_TransFilePathName': '" + m_TransFilePathName + "'}",
                        dataType: "json",
                        delay: 0,
                        autoFocus: true,
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        success: function (data) {
                            response($.map(data.d, function (item) {
                                return {
                                    label: item.split('|')[0],//show key
                                    FileNumber: item.split('|')[1], //filenumber 
                                    FileName: item.split('|')[2], //File Name
                                    FileNat: item.split('|')[3], //File Nat
                                    FileLink: item.split('|')[4],//FileLink
                                    FileLinkMsg: item.split('|')[5] //FileLinkMsg
                                }
                            }))
                        }//end on Success
                        ,
                        error: function (response) {
                            txt.attr("style", "border: solid 1px red;");
                            alert(response.responseText);
                        },//end on Error
                        failure: function (response) {
                            alert(response.responseText);
                        }//End on failure
                    });//End $.Ajax --%>
                }//end source
                });//end autocomplete

Open in new window

0
 

Author Comment

by:pamela rizk
ID: 41760840
i am removing the autocomplete text from javascript than i am adding it again
that is why i need to redefine teh autocomplete method but i couldn't .any help
0
 
LVL 60

Accepted Solution

by:
Julian Hansen earned 2000 total points
ID: 41760860
Start by putting your source function on its own - rather than defined in the autocomplete - then you can use it where ever you need.

Is the code you posted part of the code where you are adding the inputs dynamically - can you post all your code so we can see where it fits in.
0
 

Author Comment

by:pamela rizk
ID: 41760865
below is my whole code

please helpp i am stuckk
<script type="text/javascript">
    //Begin document is ready
    $(document).ready(function () {
        $('#<%=txtSearch_File.ClientID%>').attr('autocomplete', 'on');
        
        var selectedItems = { FileNat: '0', FileNumber: '0', FileName: '0' };
        var elems = [];
        EndRequestHandler();
        Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
        //Begin EndRequestHandler
        function EndRequestHandler(sender, args) {
            $("#<%=TrucButton.ClientID%>").hide();
            $("#<%=txtSearch_File.ClientID%>").autocomplete({
                //Begin on source
                source: function (request, response) {
                    var m_Category = $("#<%=hdn_Category_File.ClientID%>").val();
                    var m_SubCategory = $("#<%=hdn_SubCategory_File.ClientID%>").val();
                    var m_SessionId = $("#<%=hdn_SessionID_File.ClientID%>").val();
                    var m_CongrpStr = $("#<%=hdn_ConGrpStr_File.ClientID%>").val();
                    var m_TransFilePathName = $("#<%=hdn_trans_File.ClientID%>").val();
                    var m_txtSearch_File = $("#<%=txtSearch_File.ClientID%>").val();//added by serena
                    var searchFor;
                    searchFor = CodifyPrefix(m_txtSearch_File);
                    $.ajax({
                        url: '<%=ResolveUrl("AutoCompleteForFile.asmx/RetrieveFileData")%>',
                        data: "{ 'prefixText': '" + searchFor + "' , 'm_Category': '" + m_Category + "','m_SubCategory':'" + m_SubCategory + "','m_SessionId': '" + m_SessionId + "', 'm_ConGrpStr': '" + m_CongrpStr + "', 'm_TransFilePathName': '" + m_TransFilePathName + "'}",
                        dataType: "json",
                        delay: 0,
                        autoFocus: true,
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        success: function (data) {
                            response($.map(data.d, function (item) {
                                return {
                                    label: item.split('|')[0],//show key
                                    FileNumber: item.split('|')[1], //filenumber 
                                    FileName: item.split('|')[2], //File Name
                                    FileNat: item.split('|')[3], //File Nat
                                    FileLink: item.split('|')[4],//FileLink
                                    FileLinkMsg: item.split('|')[5] //FileLinkMsg
                                }
                            }))
                        }//end on Success
                        ,
                        error: function (response) {
                            $('#<%= txtSearch_File.ClientID%>').attr("style", "border: solid 1px red;");
                            alert(response.responseText);
                        },//end on Error
                        failure: function (response) {
                            alert(response.responseText);
                        }//End on failure
                    });//End $.Ajax
                },//end on Source
                focus: function () {
                    // prevent value inserted on focus
                    return false;
                },//end on Focus
                closeOnSelect: true,
                //end on source
                //Begin on select
                select: function (e, i) {
                    var m_AllowMultipleSelection = $("#<%=hdn_AllowMultipleSelection.ClientID%>").val();
                    if (m_AllowMultipleSelection == "1") {

                        //  
                        //selectedItems[FileName] = i.item.FileName.trim();
                        elems.push(i.item.FileName.trim());
                        var text = this.value.split(/,\s*/);
                        text.pop();// \sremove the current input
                        text.push(i.item.FileName.trim());// add the selected item
                        text.push("");  // add placeholder to get the comma-and-space at the end
                        this.value = text.join(", ");


                        var value0 = $("#<%=hdn_FileName_list.ClientID%>").val().split(/,\s*/);
                        value0.pop();
                        value0.push(i.item.FileName.trim());
                        value0.push("");
                        $("#<%=hdn_FileName_list.ClientID%>").val(value0.join(", "));

                        //selectedItems[FileNumber] = i.item.FileNumber.trim();
                        elems.push(i.item.FileNumber);
                        var value = $("#<%=Hdn_Number_File_List.ClientID%>").val().split(/,\s*/);
                        value.pop();
                        value.push(i.item.FileNumber);
                        value.push("");
                        $("#<%=Hdn_Number_File_List.ClientID%>").val(value.join(", "));

                        //selectedItems[FileNat] = i.item.FileNat.trim();
                        elems.push(i.item.FileNat);
                        var value1 = $("#<%=hdn_Filecat_list.ClientID%>").val().split(/,\s*/);
                        value1.pop();
                        value1.push(i.item.FileNat);
                        value1.push("");
                        $("#<%=hdn_Filecat_list.ClientID%>").val(value1.join(", "));

                        //$("#<%=hdn_array.ClientID%>").val(JSON.stringify(selectedItems));

                        //var myArray = $("#<%=txtSearch_File.ClientID%>")[0].value;//.split(",");

                        var myArray1 = $("#<%=txtSearch_File.ClientID%>")[0].value.split(",");

                        //remove empty array node
                        myArray1.pop();
                       
                        //remove empty array node
                        //myArray.pop();
                        //$("#<%=hdn_array.ClientID%>").val(JSON.stringify(myArray1));
                        <%-- elems.push(i.item.FileNat);
                        elems.push(i.item.FileNumber);
                        elems.push(i.item.FileName.trim());
                        $("#<%=hdn_array.ClientID%>").val(JSON.stringify(elems)); //store array--%>

                    }//End allow multiple selection 
                    else {
                        $("#<%=Hdn_Number_File.ClientID%>").val(i.item.FileNumber);
                        $("#<%=txtSearch_File.ClientID%>").val(i.item.FileName.trim());
                        $("#<%=hdn_Filecat.ClientID%>").val(i.item.FileNat);
                        if (i.item.FileName.trim() == "") {
                            $("#<%=Hdn_Number_File.ClientID%>").val("0");
                            $("#<%=txtSearch_File.ClientID%>").val("");
                        }
                        var m_OpenMode = $("#<%=hdn_OpenFile.ClientID%>").val();
                        $("#<%=TrucButton.ClientID%>").hide();
                        if (m_OpenMode == "1") {
                            $("#<%=TrucButton.ClientID%>").click();
                        }
                        $("#<%=TrucButton.ClientID%>").hide();

                    } //end allow simple selection 

                    appendColumn(i.item.FileNat, i.item.FileNumber, i.item.FileName.trim(), i.item.FileLink.trim(), i.item.FileLinkMsg.trim());//Adding Column that contains the link and delete icon
                    RemoveValueFromAutoCompleteSearch(i.item.FileNat, i.item.FileNumber, i.item.FileName.trim());
                    return false;
                }, //end on select

                minLength: 1,
                //CHAHID ON 4-1-2016
                //begin change event that work whenever we exit the autocomlpete
                change: function (event, ui) {
                    var m_AllowMultipleSelection = $("#<%=hdn_AllowMultipleSelection.ClientID%>").val();
                    //if (m_AllowMultipleSelection == "0") {
                    $("#<%=hdn_key_pressed.ClientID%>").val(event.keyCode);
                    var keypressed = $("#<%=hdn_key_pressed.ClientID%>").val();
                    if (keypressed != 13) {
                        //if (!ui.item) {
                        var x = $("#<%=txtSearch_File.ClientID%>").val();
                        var m_Category = $("#<%=hdn_Category_File.ClientID%>").val();
                        var m_ConSocStr = $("#<%=hdn_ConSocStr_File.ClientID%>").val();
                        var m_SubCategory = $("#<%=hdn_SubCategory_File.ClientID%>").val();
                        $.ajax({
                            url: '<%=ResolveUrl("AutoCompleteForFile.asmx/CheckForFileExistance")%>',
                            data: "{ 'prefixText': '" + x + "' , 'm_Category': '" + m_Category + "','m_ConSocStr': '" + m_ConSocStr + "' , 'm_SubCategory': '" + m_SubCategory + "'}",
                            dataType: "json",
                            type: "POST",
                            contentType: "application/json; charset=utf-8",
                            success:
                                function DecodifyFileOnSuccess(data) {
                                    var json = JSON.stringify(data);
                                    obj = JSON.parse(json);
                                    if (obj.d == "2") { // if it is empty
                                        if (m_AllowMultipleSelection == "0") {
                                            $("#<%=txtSearch_File.ClientID%>").val("");
                                            $("#<%=Hdn_Number_File.ClientID%>").val("0");
                                        } else {
                                            $("#<%=txtSearch_File.ClientID%>").val("");
                                            $("#<%=txtSearch_File.ClientID%>").focus();
                                        }

                                    } else {
                                        if (obj.d.split('|')[0] == "1") {

                                            //Number exist;data is valid CHAHID ON 4-1-2016
                                            var FileNat = obj.d.split('|')[3];
                                            var FileNum = obj.d.split('|')[2];
                                            var FileName = obj.d.split('|')[1].trim();
                                            var FileLink = '';
                                            var FileLinkMsg = '';
                                            if (m_AllowMultipleSelection == "0") {
                                                $("#<%=txtSearch_File.ClientID%>").val(FileName);
                                                $("#<%=Hdn_Number_File.ClientID%>").val(FileNum);
                                                $("#<%=hdn_Filecat.ClientID%>").val(FileNat);
                                                //added by chahid 5/7/2016 in order to open the file after select
                                                var m_OpenMode = $("#<%=hdn_OpenFile.ClientID%>").val();
                                                $("#<%=TrucButton.ClientID%>").hide();
                                                if (m_OpenMode == "1") {
                                                    $("#<%=TrucButton.ClientID%>").click();

                                                }
                                            } else {


                                                var value0 = $("#<%=hdn_FileName_list.ClientID%>").val().split(/,\s*/);
                                                value0.pop();
                                                value0.push(FileName);
                                                value0.push("");
                                                $("#<%=hdn_FileName_list.ClientID%>").val(value0.join(", "));

                                                var value = $("#<%=Hdn_Number_File_List.ClientID%>").val().split(/,\s*/);
                                                value.pop();
                                                value.push(FileNum);
                                                value.push("");
                                                $("#<%=Hdn_Number_File_List.ClientID%>").val(value.join(", "));

                                                var value1 = $("#<%=hdn_Filecat_list.ClientID%>").val().split(/,\s*/);
                                                value1.pop();
                                                value1.push(FileNat);
                                                value1.push("");
                                                $("#<%=hdn_Filecat_list.ClientID%>").val(value1.join(", "));

                                            }

                                            $("#<%=TrucButton.ClientID%>").hide();
                                            //end added by chahid 5/7/2016 in order to open the file after select
                                            return false;
                                        } else {
                                            var m_ValidateExistence = $("#<%=hdn_ValidateExistence.ClientID%>").val();
                                            if (m_ValidateExistence == "1") { //for validation
                                                alert("Invalid input");
                                                if (m_AllowMultipleSelection == "0") {
                                                    $("#<%=txtSearch_File.ClientID%>").val("");
                                                    $("#<%=txtSearch_File.ClientID%>").focus();
                                                    $("#<%=Hdn_Number_File.ClientID%>").val("0");
                                                } else {
                                                    $("#<%=txtSearch_File.ClientID%>").val("");
                                                    $("#<%=txtSearch_File.ClientID%>").focus();
                                                }


                                            } else {//for non validation
                                                if (m_AllowMultipleSelection == "0") {
                                                    $("#<%=Hdn_Number_File.ClientID%>").val("0");
                                                    //added by chahid 5/7/2016 in order to open the file after select
                                                    var m_OpenMode = $("#<%=hdn_OpenFile.ClientID%>").val();
                                                    $("#<%=TrucButton.ClientID%>").hide();
                                                    if (m_OpenMode == "1") {
                                                        $("#<%=TrucButton.ClientID%>").click();
                                                    }
                                                }
                                                else {
                                                    $("#<%=Hdn_Number_File_List.ClientID%>").val("0");
                                                }
                                                $("#<%=TrucButton.ClientID%>").hide();
                                                //end added by chahid 5/7/2016 in order to open the file after select
                                            }//end else

                                        }//end else
                                    }//end else
                                }//end DecodifyFileOnSuccess
                                    ,//end on sucess
                            error: function (response) {
                                $('#<%= txtSearch_File.ClientID%>').attr("style", "border: solid 1px red;");
                                alert(response.responseText);
                            },//end on error
                            failure: function (response) {
                                alert(response.responseText);
                            }//end on failure
                        });//end $.ajax
                            $("#<%=txtSearch_File.ClientID%>").autocomplete('close');
                        //}//end if (!ui.item)
                    }//end if (keypressed != 13)
                    //}//end if m_AllowMultipleSelection

                },//end on change
                //CHAHID ON 4-1-2016
                autoFocus: true //IF TRUE IT WILL SELECT THE FIRST ROW BY DEFAULT
            })//end $("#<%=txtSearch_File.ClientID%>").autocomplete(

                //key press event to handle enter pressed added by chahid on 12-jan-2016
                .keypress(function (e) {
                    var m_AllowMultipleSelection = $("#<%=hdn_AllowMultipleSelection.ClientID%>").val();
                    //if (m_AllowMultipleSelection == "0") {
                    $("#<%=hdn_key_pressed.ClientID%>").val(e.keyCode);
                    if (e.keyCode == 13) {

                        var x = $("#<%=txtSearch_File.ClientID%>").val();
                        var m_Category = $("#<%=hdn_Category_File.ClientID%>").val();
                        var m_ConSocStr = $("#<%=hdn_ConSocStr_File.ClientID%>").val();
                        var m_SubCategory = $("#<%=hdn_SubCategory_File.ClientID%>").val();
                        //commented by chahid on 5/7/2016 tokeep the text when validation mode is off
                        $.ajax({
                            url: '<%=ResolveUrl("AutoCompleteForFile.asmx/CheckForFileExistance")%>',
                            data: "{ 'prefixText': '" + x + "' , 'm_Category': '" + m_Category + "','m_ConSocStr': '" + m_ConSocStr + "' , 'm_SubCategory': '" + m_SubCategory + "'}",
                            dataType: "json",
                            type: "POST",
                            contentType: "application/json; charset=utf-8",
                            success: function DecodifyFileOnSuccess(data) {

                                var json = JSON.stringify(data);
                                obj = JSON.parse(json);

                                if (obj.d == "2") { // if it is empty
                                    if (m_AllowMultipleSelection == "0") {
                                        $("#<%=txtSearch_File.ClientID%>").val("");
                                        $("#<%=Hdn_Number_File.ClientID%>").val("0");
                                    } else {
                                        $("#<%=txtSearch_File.ClientID%>").val("");
                                        $("#<%=txtSearch_File.ClientID%>").focus();

                                    }

                                } else {
                                    if (obj.d.split('|')[0] == "1") {

                                        //Number exist;data is valid CHAHID ON 4-1-2016
                                        var FileNat = obj.d.split('|')[3];
                                        var FileNum = obj.d.split('|')[2];
                                        var FileName = obj.d.split('|')[1].trim();
                                        var FileLink = '';
                                        var FileLinkMsg = '';

                                        if (m_AllowMultipleSelection == "0") {
                                            $("#<%=txtSearch_File.ClientID%>").val(FileName);
                                            $("#<%=Hdn_Number_File.ClientID%>").val(FileNum);
                                            $("#<%=hdn_Filecat.ClientID%>").val(FileNat);
                                            //added by chahid 5/7/2016 in order to open the file after select
                                            var m_OpenMode = $("#<%=hdn_OpenFile.ClientID%>").val();
                                            $("#<%=TrucButton.ClientID%>").hide();
                                            if (m_OpenMode == "1") {
                                                $("#<%=TrucButton.ClientID%>").click();

                                            }
                                        } else {
                                            var value0 = $("#<%=hdn_FileName_list.ClientID%>").val().split(/,\s*/);
                                            value0.pop();
                                            value0.push(FileName);
                                            value0.push("");
                                            $("#<%=hdn_FileName_list.ClientID%>").val(value0.join(", "));

                                            var value = $("#<%=Hdn_Number_File_List.ClientID%>").val().split(/,\s*/);
                                            value.pop();
                                            value.push(FileNum);
                                            value.push("");
                                            $("#<%=Hdn_Number_File_List.ClientID%>").val(value.join(", "));

                                            var value1 = $("#<%=hdn_Filecat_list.ClientID%>").val().split(/,\s*/);
                                            value1.pop();
                                            value1.push(FileNat);
                                            value1.push("");
                                            $("#<%=hdn_Filecat_list.ClientID%>").val(value1.join(", "));

                                            appendColumn(FileNat, FileNum, FileName, FileLink, FileLinkMsg);//Adding Column that contains the link and delete icon
                                            $("#<%=txtSearch_File.ClientID%>").val("");
                                        }

                                        $("#<%=TrucButton.ClientID%>").hide();
                                        //end added by chahid 5/7/2016 in order to open the file after select
                                        return false;
                                    } else {
                                        var m_ValidateExistence = $("#<%=hdn_ValidateExistence.ClientID%>").val();
                                        if (m_ValidateExistence == "1") { //for validation
                                            alert("Invalid input");
                                            if (m_AllowMultipleSelection == "0") {
                                                $("#<%=txtSearch_File.ClientID%>").val("");
                                                $("#<%=txtSearch_File.ClientID%>").focus();
                                                $("#<%=Hdn_Number_File.ClientID%>").val("0");
                                            } else {
                                                $("#<%=txtSearch_File.ClientID%>").val("");
                                                $("#<%=txtSearch_File.ClientID%>").focus();
                                            }


                                        } else {//for non validation
                                            if (m_AllowMultipleSelection == "0") {
                                                $("#<%=Hdn_Number_File.ClientID%>").val("0");
                                                //added by chahid 5/7/2016 in order to open the file after select
                                                var m_OpenMode = $("#<%=hdn_OpenFile.ClientID%>").val();
                                                $("#<%=TrucButton.ClientID%>").hide();
                                                if (m_OpenMode == "1") {
                                                    $("#<%=TrucButton.ClientID%>").click();
                                                }
                                            }
                                            else {
                                                $("#<%=Hdn_Number_File_List.ClientID%>").val("0");
                                            }
                                            $("#<%=TrucButton.ClientID%>").hide();
                                            //end added by chahid 5/7/2016 in order to open the file after select
                                        }//end else

                                    }//end else
                                }//end else
                            }//end DecodifyFileOnSuccess
                            ,//end on sucess
                            error: function (response) {
                                $('#<%= txtSearch_File.ClientID%>').attr("style", "border: solid 1px red;");
                                alert(response.responseText);
                            },//end on error
                            failure: function (response) {
                                alert(response.responseText);
                            }//end on failure
                        }); //end $.ajax({
                            $("#<%=txtSearch_File.ClientID%>").autocomplete('close');
                    }//end e.keyCodes event to handle enter pressed added by chahid on 12-jan-2016 
                    //}//end if m_AllowMultipleSelection =0

                })//end .keypress(
            //hilight the data

            .data("ui-autocomplete")._renderItem = function (ul, item) {
                var $a = $("<a></a>").text(item.label);
                highlightText(this.term, $a);
                return $("<li></li>").append($a).appendTo(ul);
            }//end hilight the data 


            //function that hilight the text typed 
                function highlightText(text, $node) {
                    var searchText = $.trim(text).toLowerCase(), currentNode = $node.get(0).firstChild, matchIndex, newTextNode, newSpanNode;
                    while ((matchIndex = currentNode.data.toLowerCase().indexOf(searchText)) >= 0) {
                        newTextNode = currentNode.splitText(matchIndex);
                        currentNode = newTextNode.splitText(searchText.length);
                        newSpanNode = document.createElement("span");
                        newSpanNode.className = "highlight";
                        currentNode.parentNode.insertBefore(newSpanNode, currentNode);
                        newSpanNode.appendChild(newTextNode);
                    }
                }


            //end functionhilight


            // Hide table columns with index greater then 0
                function HideColumn(div, FileNat, FileNumber, FileName) {
                    div.style.display = "none";
                var m_Number_File_List = $("#<%=Hdn_Number_File_List.ClientID%>").val();//added by serena
                    m_Number_File_List = m_Number_File_List.replace(FileNumber.concat(", "), '');
                    $("#<%=Hdn_Number_File_List.ClientID%>").val(m_Number_File_List);


                var m_Filecat_list = $("#<%=hdn_Filecat_list.ClientID%>").val();//added by serena
                    m_Filecat_list = m_Filecat_list.replace(FileNat.concat(", "), '');
                    $("#<%=hdn_Filecat_list.ClientID%>").val(m_Filecat_list);


                var m_FileName_list = $("#<%=hdn_FileName_list.ClientID%>").val();//added by serena
                    m_FileName_list = m_FileName_list.replace(FileName.concat(", "), '');
                    $("#<%=hdn_FileName_list.ClientID%>").val(m_FileName_list);

            }

            function RemoveValueFromAutoCompleteSearch(FileNat, FileNumber, FileName) {
                var m_txtSearch_File = $("#<%=txtSearch_File.ClientID%>").val();//added by
                m_txtSearch_File = m_txtSearch_File.replace(FileName.concat(", "), '');
                $("#<%=txtSearch_File.ClientID%>").val(m_txtSearch_File);

            }
            function Success(result) {
                alert(result);
            }
            function Failure(error) {
                alert(error);
            }
           
            // append column to the HTML table
            function appendColumn(FileNat, FileNumber, FileName, FileLink, FileLinkMsg) {
                $("#<%=txtSearch_File.ClientID%>").remove();
                var Pnl_Dyntables = document.getElementById('<%= Pnl_tables.ClientID%>');// Pnl_tables reference
                var Createddiv = document.createElement('div'); // create DIV element with below styles :style = "display: inline-block ; white-space: nowrap;"
                Createddiv.style.display = "inline-block";
                Createddiv.style.whiteSpace = "nowrap";
                Createddiv.style.setProperty('float', 'left');
                Createddiv.style.cssFloat = "left";

             

                // Create table.
                var createdtable = document.createElement('table');
                // Insert New Row for table at index '0'.
                var row1 = createdtable.insertRow(0);
                // Insert New Column for Row1 at index '0'.
                var row1col1 = row1.insertCell(0);
                var CellNbre = createdtable.rows[0].cells.length;
                var File_Link = document.createElement('a');
                File_Link.href = FileLink;
                File_Link.setAttribute('target', '_blank');
                File_Link.style.color = 'black';
                var m_FileName = FileName.replace(/\s+/g, '');
                File_Link.text = m_FileName;

                row1col1.setAttribute('width', 'auto');
                row1col1.setAttribute('height', '22px');
                row1col1.setAttribute('white-space', 'nowrap');
                row1col1.setAttribute('class', 'textBoxStylerounded');
                row1col1.style.border = "solid 0px";
                row1col1.style.backgroundColor = "#ECF5FF";
                row1col1.setAttribute('text-align', 'center');

                var img = document.createElement('img');
                img.src = "../../Images/NewIcons/deleteline_Dis_Icon.png";
                img.setAttribute('width', '15px');
                img.setAttribute('height', '15px');
                img.setAttribute('display', 'inline');
                img.setAttribute('vertical-align', 'middle');
                img.style.cursor = "pointer";

                img.onclick = function () {
                    HideColumn(Createddiv, FileNat, FileNumber, FileName);
                };
                row1col1.appendChild(File_Link);    // append text node to the DIV
                row1col1.appendChild(img); // append text node to the DIV

                Createddiv.appendChild(createdtable);// append DIV to the table cell
                var txt = document.createElement("input");
                txt.id = 'txtSearch_File';
                txt.setAttribute('type', 'text');
                txt.setAttribute('name', 'txtSearch_File');
                txt.setAttribute('Height', '22px');
                txt.setAttribute('Width', '600px');
                txt.setAttribute('CssClass', 'textBoxStylerounded');
                txt.placeholder = 'Click Here';
                txt.style.cursor = 'pointer';
                txt.autocomplete = 'on';
                txt.setAttribute('autocomplete', 'on');
                txt.setAttribute('font-family', 'Calibri');
                txt.setAttribute('font-size', '10pt');
                txt.setAttribute('color', 'navy');
                txt.setAttribute('margin-left', '0px');
                txt.setAttribute('margin-top', '0px');
                txt.setAttribute('border-style', 'none');
               // txt.autocomplete({

                    //Begin on source
                   <%-- source: function (request, response) {
                      var m_Category = $("#<%=hdn_Category_File.ClientID%>").val();
                     var m_SubCategory = $("#<%=hdn_SubCategory_File.ClientID%>").val();
                    var m_SessionId = $("#<%=hdn_SessionID_File.ClientID%>").val();
                    var m_CongrpStr = $("#<%=hdn_ConGrpStr_File.ClientID%>").val();
                    var m_TransFilePathName = $("#<%=hdn_trans_File.ClientID%>").val();
                      var m_txtSearch_File = txt.value;//added by serena
                    var searchFor;
                    searchFor = CodifyPrefix(m_txtSearch_File);
                    $.ajax({
                        url: '<%=ResolveUrl("AutoCompleteForFile.asmx/RetrieveFileData")%>',
                        data: "{ 'prefixText': '" + searchFor + "' , 'm_Category': '" + m_Category + "','m_SubCategory':'" + m_SubCategory + "','m_SessionId': '" + m_SessionId + "', 'm_ConGrpStr': '" + m_CongrpStr + "', 'm_TransFilePathName': '" + m_TransFilePathName + "'}",
                        dataType: "json",
                        delay: 0,
                        autoFocus: true,
                        type: "POST",
                        contentType: "application/json; charset=utf-8",
                        success: function (data) {
                            response($.map(data.d, function (item) {
                                return {
                                    label: item.split('|')[0],//show key
                                    FileNumber: item.split('|')[1], //filenumber 
                                    FileName: item.split('|')[2], //File Name
                                    FileNat: item.split('|')[3], //File Nat
                                    FileLink: item.split('|')[4],//FileLink
                                    FileLinkMsg: item.split('|')[5] //FileLinkMsg
                                }
                            }))
                        }//end on Success
                        ,
                        error: function (response) {
                            txt.attr("style", "border: solid 1px red;");
                            alert(response.responseText);
                        },//end on Error
                        failure: function (response) {
                            alert(response.responseText);
                        }//End on failure
                    });//End $.Ajax 
                }//end source--%>
                //});//end autocomplete
               // txt.focus();
                
                
                Pnl_Dyntables.appendChild(Createddiv);// append DIV to the table cell
                Pnl_Dyntables.appendChild(txt);// append DIV to the table cell
            }//End append Function
            }//end EndRequestHandler
    });//end $(document).ready(function ()
   
</script>

                    <asp:Panel ID="Pnl_tables"  runat="server" Height="100%" Width="100%" ScrollBars="Auto">
                 
 
          
        <asp:TextBox ID="txtSearch_File" runat="server" Height="22px"
        CssClass="textBoxStylerounded" Width="100px" autocomplete="on" 
        Style="cursor: pointer;" onkeyDown="AdjustWidth(this);" onKeyUp="AdjustWidth(this);"
        placeholder="Click Here"></asp:TextBox>
           
       <asp:Label ID="lbl_mandatory" runat="server" Text="*" ForeColor="Red" Visible="false"></asp:Label>
        <asp:ImageButton ID="btn_search" runat="server" Width="20px" Height="20px"
        ImageUrl="~/Images/Find-en-ico.png" TabIndex="-1" Style="vertical-align: middle; padding-top: 0.5%; padding-bottom: 0.5%"
        CausesValidation="false" Visible="false" />
           
      </asp:Panel>
               
<asp:HiddenField ID="hdn_Category_File" runat="server" />
<asp:HiddenField ID="hdn_SubCategory_File" runat="server" />

<asp:HiddenField ID="hdn_SessionID_File" runat="server" />
<asp:HiddenField ID="hdn_ConGrpStr_File" runat="server" />
<asp:HiddenField ID="hdn_ConSocStr_File" runat="server" />
<asp:HiddenField ID="Hdn_Number_File" runat="server" />

<asp:HiddenField ID="Hdn_Number_File_List" runat="server" />
<asp:HiddenField ID="hdn_Filecat" runat="server" />
<asp:HiddenField ID="hdn_Filecat_list" runat="server" />
<asp:HiddenField ID="hdn_FileName_list" runat="server" />

<asp:HiddenField ID="hdn_OpenFile" runat="server" />
<asp:HiddenField ID="hdn_ValidateExistence" runat="server" />
<asp:HiddenField ID="hdn_key_pressed" runat="server" />
<asp:HiddenField ID="hdn_AllowMultipleSelection" runat="server" />
<asp:HiddenField ID="hdn_trans_File" runat="server" />
<asp:HiddenField ID="hdn_array" runat="server" />


<asp:Button ID="TrucButton"
    runat="server"
    Text="" BorderStyle="None"
    BackColor="Transparent"
    CausesValidation="false" />

Open in new window

0
 
LVL 60

Expert Comment

by:Julian Hansen
ID: 41760884
What is this code trying to do - it seems extremely involved - can you describe what you are trying to achieve.

Also, can you show me where in your code you are trying to dynamically create a text box.
0
 

Author Comment

by:pamela rizk
ID: 41766376
dear  mr julian
thnak you i changed the concept
0
 
LVL 60

Expert Comment

by:Julian Hansen
ID: 41766581
I don't understand?
0
 

Author Closing Comment

by:pamela rizk
ID: 41781163
ok
0

Featured Post

Industry Leaders: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

In this article you'll learn how to use Ajax calls within your CodeIgniter application. To explain this, I'll illustrate how to implement a simple contact form to allow visitors to send you an email through your web site.
Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

927 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question