Click here to Skip to main content
14,697,269 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
How do I set the number of rows to display in a HTML table according to a drop-down selection in ASP.Net (C#) using jQuery and json (ajax call method)?

Already done:
Displaying table based on drop down selection.now same table have to display pagination from another drop down list(no.of records count per page).here also have to use jquery,json.

What I have tried:

aspx page

<script type="text/javascript">
        function funChangeTable(ddlObj) {
            var name = ddlObj.value;
            debugger;
            $.ajax({
                url: 'JsonLast.aspx/GetTableData',
                data: JSON.stringify({ tableName: name }),
                type: 'post',
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function(response) {
                    debugger;
                    var json = JSON.parse(response.d);
                    generateTable(json);
                },
                error: function(a, b, c) {
                    console.log(a, b, c);
                }
            });
        }
 
        function generateTable(json) {
         
            var $table = $('#tblDynamic');
            $table.find('thead').empty()
            $table.find('tbody').empty()
            if (json && json.length > 0) {
                var header = json[0];
                var columns = [];
                for (var col in header) {
                    columns.push('<th>' + col + '</th>');
                }
                $table.find('thead').append('<tr>' + columns.join('') + '</tr>');
                debugger;
                var rows = [];
                for (var i = 0; i < json.length; i++) {
                    debugger;
                    var row = json[i];
                    var tds = [];
                    for (var col in row) {
                        tds.push('<td>' + row[col] + '</td>');
                       // tds.push('<td>' + row.city_name + '</td>');
                       // tds.push('<td>' + row.population + '</td>');
                       //tds.push('<td>' + row.year + '</td>');
                    }  
                    rows.push('<tr>' + tds.join() + '</tr>');
                }
                $table.find('tbody').append(rows.join(''));
            }
 
        }
 
    </script>


code behind

protected void Page_Load(object sender, EventArgs e)
{
    var data = GetAllTableNames();
    ddlTableNames.DataSource = data;
    ddlTableNames.DataBind();
    ddlTableNames.Items.Insert(0, "Select a Table");
}
private static string[] GetAllTableNames()
{
    SqlConnection con = new SqlConnection(@"user id=sa;password=ssa;database=Mohan;data source=PCTH101\PCTH101");
    SqlCommand cmd = new SqlCommand("select name from sys.tables", con);
    SqlDataAdapter da = new SqlDataAdapter(cmd);
    DataTable dt = new DataTable();
    da.Fill(dt);
    return dt.AsEnumerable().Select(k => k[0] + "").ToArray();
}
[WebMethod]
public static string GetTableData(string tableName)
{
    if (GetAllTableNames().Contains(tableName)) // To avoid sql injection
    {
        SqlConnection con = new SqlConnection(@"user id=sa;password=ssa;database=Mohan;data source=PCTH101\PCTH101");
        SqlCommand cmd = new SqlCommand("select * from " + tableName, con);
        SqlDataAdapter da = new SqlDataAdapter(cmd);
        DataTable dt = new DataTable();
        da.Fill(dt);
        string json = JsonConvert.SerializeObject(dt);
        return json;
    }
    else
        return "Table Name Not Found";
}
Posted

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)




CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900