0

I am trying to load the records from database through id,but when the function executes it load the data in array but not display in table.it not showing any error also not in browser console.i am also use the debugger and check the line by line,but it doesn't shows any error. How to solve. Thanks in Advance. i need to perform edit on that data i am using the html table with 10 column and 6 rows with 8 cell of table is textbox and 2 are dropdown when records retrieve from database according to daycode it must be load in that textbox in that table for edit,hence i declare the 6 tbody with textboxes. Code:

<table role="grid" class=" div boder" id="divintable2">
    <thead role="row" >
        <tr>
            <th style="text-align:center;width:22%" aria-controls="divintable2">A/c Description</th>
            <th style="text-align:center;width:15%" aria-controls="divintable2">Field Name-1</th>
            <th style="text-align:center; width:15%" aria-controls="divintable2">Field Name-2</th>
            <th style="text-align:center; width:12%" aria-controls="divintable2">Type</th>
            <th style="text-align:center; width:12%" aria-controls="divintable2">Calc.Method</th>
            <th style="text-align:center;"  aria-controls="divintable2"></th>
            <th style="text-align:center; " aria-controls="divintable2">Link</th>
            <th style="text-align:center;" aria-controls="divintable2">A/c</th>
            <th style="text-align:center; " aria-controls="divintable2">%</th>
            <th style="text-align:center; " aria-controls="divintable2"></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>
                <asp:TextBox ID="a11" runat="server" class="form-control input-sm" style="width: 150px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="b11" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="c11" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="d11" runat="server" style="width:90px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="T">Tax</asp:ListItem>
                    <asp:ListItem Value="O">Others</asp:ListItem>
                    <asp:ListItem Value="S">SubTotal</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:DropDownList ID="e11" runat="server" style="width:90px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="N">Normal</asp:ListItem>
                    <asp:ListItem Value="P">Percentage</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="S">Summary</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="f11" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="g11" runat="server" style="width:30px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="Y">Y</asp:ListItem>
                    <asp:ListItem Value="N">N</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="h11" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="i11" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="j11" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td>
                <asp:TextBox ID="a22" runat="server" class="form-control input-sm" style="width: 150px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="b22" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="c22" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="d22" runat="server" style="width:90px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="T">Tax</asp:ListItem>
                    <asp:ListItem Value="O">Others</asp:ListItem>
                    <asp:ListItem Value="S">SubTotal</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:DropDownList ID="e22" runat="server" style="width:90px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="N">Normal</asp:ListItem>
                    <asp:ListItem Value="P">Percentage</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="S">Summary</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="f22" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="g22" runat="server" style="width:30px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="Y">Y</asp:ListItem>
                    <asp:ListItem Value="N">N</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="h22" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="i22" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="j22" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td>
                <asp:TextBox ID="a33" runat="server" class="form-control input-sm" style="width: 150px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="b33" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="c33" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="d33" runat="server" style="width:80px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="T">Tax</asp:ListItem>
                    <asp:ListItem Value="O">Others</asp:ListItem>
                    <asp:ListItem Value="S">SubTotal</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:DropDownList ID="e33" runat="server" style="width:80px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="N">Normal</asp:ListItem>
                    <asp:ListItem Value="P">Percentage</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="S">Summary</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="f33" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="g33" runat="server" style="width:30px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="Y">Y</asp:ListItem>
                    <asp:ListItem Value="N">N</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="h33" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="i33" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="j33" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td>
                <asp:TextBox ID="a44" runat="server" class="form-control input-sm" style="width: 150px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="b44" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="c44" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="d44" runat="server" style="width:80px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="T">Tax</asp:ListItem>
                    <asp:ListItem Value="O">Others</asp:ListItem>
                    <asp:ListItem Value="S">SubTotal</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:DropDownList ID="e44" runat="server" style="width:80px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="N">Normal</asp:ListItem>
                    <asp:ListItem Value="P">Percentage</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="S">Summary</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="f44" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="g44" runat="server" style="width:30px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="Y">Y</asp:ListItem>
                    <asp:ListItem Value="N">N</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="h44" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="i44" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="j44" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td>
                <asp:TextBox ID="a55" runat="server" class="form-control input-sm" style="width: 150px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="b55" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="c55" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="d55" runat="server" style="width:80px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="T">Tax</asp:ListItem>
                    <asp:ListItem Value="O">Others</asp:ListItem>
                    <asp:ListItem Value="S">SubTotal</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:DropDownList ID="e55" runat="server" style="width:80px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="N">Normal</asp:ListItem>
                    <asp:ListItem Value="P">Percentage</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="S">Summary</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="TextBox1" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="g55" runat="server" style="width:30px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="Y">Y</asp:ListItem>
                    <asp:ListItem Value="N">N</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="h55" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="i55" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="j55" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
        </tr>
    </tbody>
    <tbody>
        <tr>
            <td>
                <asp:TextBox ID="a66" runat="server" class="form-control input-sm" style="width: 150px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="b66" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="c66" runat="server" class="form-control input-sm" style="width: 100px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="d66" runat="server" style="width:80px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="T">Tax</asp:ListItem>
                    <asp:ListItem Value="O">Others</asp:ListItem>
                    <asp:ListItem Value="S">SubTotal</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:DropDownList ID="e66" runat="server" style="width:80px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="N">Normal</asp:ListItem>
                    <asp:ListItem Value="P">Percentage</asp:ListItem>
                    <asp:ListItem Value="D">Discount</asp:ListItem>
                    <asp:ListItem Value="S">Summary</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="f66" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:DropDownList ID="g66" runat="server" style="width:30px" class="form-control input-sm">
                    <asp:ListItem>--Select--</asp:ListItem>
                    <asp:ListItem Value="Y">Y</asp:ListItem>
                    <asp:ListItem Value="N">N</asp:ListItem>
                </asp:DropDownList>
            </td>
            <td>
                <asp:TextBox ID="h66" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="i66" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
            <td>
                <asp:TextBox ID="j66" runat="server" class="form-control input-sm" style="width: 30px"></asp:TextBox>
            </td>
        </tr>
    </tbody>
</table>

Ajax Function:

$(document).on("click", ".editButton", function() {
    $("#myModalEdit").focus();
    var id = $(this).attr("data-id");
    debugger;
    console.log(id);
    $("#btnUpdate").attr("edit-id", id);
    $.ajax({
        type: "Post",
        contentType: "application/json; charset=utf-8",
        url: "DaybookMast.aspx/GetData",
        data: JSON.stringify({
            daycode: "" + id + ""
        }),
        dataType: "json",
        success: function(data) {
            $("#divintable2").remove();
            for (var i = 0; i < data.d.length; i++) {
                $("#divintable2").append("<tr><td>" + data.d[i].Ledger + "</td><td>" + data.d[i].Datafld + "</td>" +
                    "<td>" + data.d[i].ADatafld + "</td>" + "<td>" + data.d[i].LType + "</td>" +
                    "<td>" + data.d[i].CType + "</td>" + "<td>" + data.d[i].LAcNo + "</td>" + "<td>" + data.d[i].Type + "</td>" +
                    "<td>" + data.d[i].Link + "</td>" + "<td>" + data.d[i].TPer + "</td>" + "<td>" + data.d[i].TCalc + "</td>" +
                    "</td></tr>")
            }



        },
        error: function(XMLHttpRequest, textStatus, errorThrown) {
            debugger;
            alert("Error while retrieving data of :" + textStatus);
            alert("Error: " + XMLHttpRequest.responseText);
        }
    });

});
WebMethod: -[WebMethod]
public static DayBookDetails[] GetData(string daycode) {
    var details = new List < DayBookDetails > ();
    using(var scon = new SqlConnection(strConnection)) {
        var query = "select DayCode,Ledger,Datafld,ADatafld,LType,CType,LAcNo,Type,Link,TPer,TCalc from DayBookDetails where DayCode='" + daycode + "'";
        using(var cmd = new SqlCommand(query, scon)) {
            using(var sda = new SqlDataAdapter()) {
                cmd.Connection = scon;
                sda.SelectCommand = cmd;
                TableData.Clear();
                sda.Fill(TableData);
                details.AddRange(from DataRow dtrow in TableData.Rows select new DayBookDetails {
                    Ledger = dtrow["Ledger"].ToString(),
                        Datafld = dtrow["Datafld"].ToString(),
                        ADatafld = dtrow["ADatafld"].ToString(),
                        LType = dtrow["LType"].ToString(),
                        CType = dtrow["CType"].ToString(),
                        LAcNo = dtrow["LAcNo"].ToString(),
                        Type = dtrow["Type"].ToString(),
                        Link = dtrow["Link"].ToString(),
                        TPer = dtrow["TPer"].ToString(),
                        TCalc = dtrow["TCalc"].ToString()
                });

            }
        }
    }
    return details.ToArray();
}
Chetan Sarode
  • 79
  • 9
  • 1
    Possible duplicate of [Ajax function not working](http://stackoverflow.com/questions/39592576/ajax-function-not-working) – Liam Oct 14 '16 at 09:45

2 Answers2

0

You are removing the table DOM element by calling $("#divintable2").remove() in your ajax success handler. Instead of that try emptying only tbody and append data to it with following code:

success: function (data) {
                    $("#divintable2 tbody").empty();//empty the tbody
                    for(var i=0;i<data.d.length;i++)
                    {
                        $("#divintable2 tbody").append("<tr><td>" + data.d[i].Ledger + "</td><td>" + data.d[i].Datafld + "</td>" +
                    "<td>" + data.d[i].ADatafld + "</td>" + "<td>" + data.d[i].LType + "</td>" +
                    "<td>" + data.d[i].CType + "</td>" + "<td>" + data.d[i].LAcNo + "</td>" + "<td>" + data.d[i].Type + "</td>"
                    + "<td>" + data.d[i].Link + "</td>" + "<td>" + data.d[i].TPer + "</td>" + "<td>" + data.d[i].TCalc + "</td>" +
                    "</td></tr>")
                    }



                }
vijayP
  • 11,432
  • 5
  • 25
  • 40
  • now its loading the data but thead is not showing and i need not hide the table when daycode is empty.means i need to show the fix table with 6 rows when data is available its shows in that otherwise empty table is must shows.. – Chetan Sarode Sep 19 '16 at 06:22
  • and also its not loading in textbox i am not able to edit it. – Chetan Sarode Sep 19 '16 at 06:29
  • please update your question and clarify what should happen on ajax success handler. From your success handler code i think you want to delete the HTML table and then you are trying to append `` again back to page. – vijayP Sep 19 '16 at 06:34
0

I think you are after something like this

success: function (data) {
                $("#divintable2").append("<tbody>");
                for(var i=0;i<data.d.length;i++)
                {
                    $("#divintable2").append("<tr><td>" + data.d[i].Ledger + "</td><td>" + data.d[i].Datafld + "</td>" +
                "<td>" + data.d[i].ADatafld + "</td>" + "<td>" + data.d[i].LType + "</td>" +
                "<td>" + data.d[i].CType + "</td>" + "<td>" + data.d[i].LAcNo + "</td>" + "<td>" + data.d[i].Type + "</td>"
                + "<td>" + data.d[i].Link + "</td>" + "<td>" + data.d[i].TPer + "</td>" + "<td>" + data.d[i].TCalc + "</td>" +
                "</td></tr>")
                }

$("#divintable2").append("</tbody>");

            }
snit80
  • 623
  • 7
  • 13