Rajiv.net40 Ответов: 2

Отображение значения базы данных в HTML таблицу с помощью метода вызова jQuery ajax в ASP.NET

дорогие все,

я пытаюсь отобразить значение базы данных в html таблицу с помощью метода вызова jquery ajax в asp.net

но это не показывается. пожалуйста помогите мне

Что я уже пробовал:

функция Bindtable() {
$(документ).готово(функция () {

ВАР подряд = "";
$.Аякс({
тип: "почта",
URL-адрес: "wsc_common.на asmx/bindtable",
данные: "{}",
contentType: "application/json; charset=utf-8",
тип данных: "json",
успех: функция (msg) {
$.each(msg.d, function (index, obj) {
ряд += "
"+ obj-файлы.пид + " "+ obj-файлы.p_name + " "+ obj-файлы.p_mobile + " "+ obj-файлы.p_location + "
";

});

$("#tbDetails tbody").append(строка);
}
});


});
}

Karthik_Mahalingam

опубликуйте свой код webmethod
bindtable()

Rajiv.net40

[WebMethod]
[ScriptMethod(UseHttpGet = false, ResponseFormat = ResponseFormat.Json)]
публичная строка bindtable()
{
dllgetinfo info = новый dllgetinfo();
вернуться информация.showdata();
}

//=======
публичная строка showdata()
{
строка qry = "select *from usr";
DataTable dt = dllmain.ExecuteselectQry_returns_datatable(qry по);
возврат getdatatabletojson(dt);


}

публичная статическая строка getdatatabletojson(DataTable dt)
{
string str = строка.Пустой;
JavaScriptSerializer сериализатор = новый JavaScriptSerializer();
Список<словарь на<строка, объект=""&ГТ;&ГТ; строки = новый список<словарь на<строка, объект=""&ГТ;&ГТ;();
Словарь<string, object=""> row;
по каждому элементу (объекта datarow Dr в ДТ.Строк)
{
row = new Dictionary<string, object="">();
по каждому элементу (объект datacolumn Коль в ДТ.Столбцы)
{
ряд.Добавить(col.ColumnName, dr[col]);
}
строки.Добавить(строка);
}
str = сериализатор.Сериализация(строки);
возврат стр;

}

Karthik_Mahalingam

проверьте решение

2 Ответов

Рейтинг:
15

Karthik_Mahalingam

попробовать это

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>

    <script src="jquery.min.js"></script>
    <script>

        function BindTable()
        {
            
            $.ajax({
                type: "POST",
                url: "WebService1.asmx/bindtable",
                data: "{}",
                contentType: "application/json; charset=utf-8",
                dataType: "json",
                success: function (msg) {
                    var json = JSON.parse(msg.d);
                    $.each(json, function (index, obj) { 
                        var row = '<tr><td> ' + obj.pid + ' </td> <td> ' + obj.p_name + ' </td> <td>' + obj.p_mobile + '</td> <td>' + obj.p_location + '</td> </tr>'
                        $("#tbDetails tbody").append(row);
                    }); 
                }
            });

        }


        $(document).ready(function () {
            BindTable();
        });
    </script>


</head>
<body>
    
    <table id="tbDetails">
        <tr>
            <td>ID</td> <td>Name</td> <td>Mobile</td> <td>Location</td>
        </tr>
        <tbody>

        </tbody>
    </table>

</body>
</html>

Karthik_Mahalingam

Я жестко закодировал служебный код вот так, к вашему сведению


[WebMethod]
[ScriptMethod(UseHttpGet = false, ResponseFormat = ResponseFormat.Json)]
public string bindtable()
{

return this.showdata();
}

//=======
public string showdata()
{

DataTable dt = new DataTable();
dt.Columns.Add("pid");
dt.Columns.Add("p_name");
dt.Columns.Add("p_mobile");
dt.Columns.Add("p_location");
dt.Rows.Add(1, "karthik", 1234, "TamilNadu");
dt.Rows.Add(1, "kavya", 456, "TamilNadu");
return getdatatabletojson(dt);


}

Rajiv.net40

сэр, ваш код работает нормально, но с этим что-то не так. когда я нажимаю кнопку getdata, она повторяет таблицу complit.если я нажму 2 раза, он повторит таблицы два раза .....plz решите это

Karthik_Mahalingam

Ладно подожди

Karthik_Mahalingam

добавьте эту строку
$("#tbDetails tbody").find('tr').remove(); ..
.-------------


функция BindTable()
{
$("#tbDetails tbody").find('tr').remove();
ВАР подряд = "";
$.Аякс({
тип: "почта",
URL-адрес: "WebService1.на asmx/bindtable",
данные: "{}",
contentType: "application/json; charset=utf-8",
тип данных: "json",
успех: функция (msg) {
ВАР в JSON = json-файле.синтаксический анализ(сообщ.д);
$.each(json, function (index, obj) {
отладчик;
ВАР подряд = в '<тр&ГТ;&ЛТ;тд&ГТ; ' + obj-файлы.пид + в '</тд&ГТ; &ЛТ;тд&ГТ; ' + obj-файлы.p_name + в ' </тд&ГТ; &ЛТ;тд&ГТ;' + obj-файлы.p_mobile + в '</тд&ГТ; &ЛТ;тд&ГТ;' + obj-файлы.p_location + в '</тд&ГТ; &ЛТ;/тр&ГТ;'
$("#tbDetails tbody").append(строка);
});


}
});

}

Rajiv.net40

это не работает сэр

Karthik_Mahalingam

Опубликуйте свой полный код aspx

Rajiv.net40

<pre lang="C#">public static DataTable ExecuteselectQry_returns_datatable(строка qry)
{
SqlConnection con = new SqlConnection(WebConfigurationManager.ConnectionStrings["кон"].Метод toString());

DataTable dt = новый DataTable();
SqlDataAdapter da = новый SqlDataAdapter();
SqlCommand cmd = новая команда SqlCommand(qry, con);
да.Команды selectcommand = ЦМД;
против.Открыть();
да.Заполнить(ДТ);

против.Закрывать();
возврат dt;

}</pre>


<pre lang="C#">public string showdata()
{
строка qry = "select *from usr";
DataTable dt = dllmain.ExecuteselectQry_returns_datatable(qry по);
возврат getdatatabletojson(dt);


}

публичная статическая строка getdatatabletojson(DataTable dt)
{
string str = строка.Пустой;
JavaScriptSerializer сериализатор = новый JavaScriptSerializer();
List<Dictionary<string, object>> rows = новый список<Dictionary<string, object>>();
Словарь<строка, Объект> строка;
по каждому элементу (объекта datarow Dr в ДТ.Строк)
{
row = новый словарь<string, object>();
по каждому элементу (объект datacolumn Коль в ДТ.Столбцы)
{
ряд.Добавить(col.ColumnName, dr[col]);
}
строки.Добавить(строка);
}
str = сериализатор.Сериализация(строки);
возврат стр;

}</pre>


<pre lang="C#">[WebMethod]
[ScriptMethod(UseHttpGet = false, ResponseFormat = ResponseFormat.Json)]
публичная строка bindtable()
{
dllgetinfo info = новый dllgetinfo();
вернуться информация.showdata();
}</pre>

Karthik_Mahalingam

Сэр
Я спросил код aspx
Код разметки

Rajiv.net40

//=== aspx
&ЛТ;%@ страницы язык="в C#" AutoEventWireup значение=значение"true" CodeFile="тест1.aspx-файл.КС" наследует="UserControls_test1" %&ГТ;

<!Элемент DOCTYPE в HTML общественности "-//W3C для//определения DTD XHTML 1.0 переходный//ванной" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&ГТ;
&ЛТ;%@ зарегистрироваться в src="~/элементы управления UserControl/ucTabeltest.ascx вносятся" отметить,="СРТ" атрибута tagprefix="uctbl" %&ГТ;
<html xmlns="http://www.w3.org/1999/xhtml">
&ЛТ;глава атрибут runat="сервер"и GT;
&ЛТ;скрипт СРЦ="script/jquery-3.0.0.js" тип="текст/JavaScript"&ГТ;&ЛТ;/скрипт>
&ЛТ;скрипт СРЦ="script/bootstrap.js" тип="текст/JavaScript"&ГТ;&ЛТ;/скрипт>
&ЛТ;скрипт СРЦ="script/bootstrap.min.js" тип="текст/JavaScript"&ГТ;&ЛТ;/скрипт>
&ЛТ;скрипт СРЦ="script/jquery-1.11.2.min.js" тип="текст/JavaScript"&ГТ;&ЛТ;/скрипт>
&ЛТ;скрипт СРЦ="script/npm.js" тип="текст/JavaScript"&ГТ;&ЛТ;/скрипт>


<link href="css/bootstrap-theme.css" rel="таблица стилей" type="text/css" />
<link href="css/bootstrap-theme.min.css" rel="таблица стилей" type="text/css" />
<ссылка с href="css с/начальной загрузки.ПТК" отн="стилей" тип="текст/CSS в" /&ГТ;
<ссылка с href="css с/начальной загрузки.мин.ПТК" отн="стилей" тип="текст/CSS в" /&ГТ;

в <название&ГТ;&ЛТ;/название&ГТ;
</head>
<тело>
&ЛТ;форме ID="форма form1" атрибут runat="сервер"и GT;
<div>
&ЛТ;uctbl:СРТ идентификатор="СРТ" атрибут runat="сервер" /&ГТ;
</div>
</форма>
</body>
</html>


//====== контроллер

&ЛТ;%@ управления "язык" ="язык C#" AutoEventWireup значение=значение"true" CodeFile="ucTabeltest.ascx вносятся.КС" наследует="UserControls_ucTabeltest" %&ГТ;

&ЛТ;скрипт СРЦ="script/userdefiendfees.js" тип="текст/JavaScript"&ГТ;&ЛТ;/скрипт>
<div>
в <тип входного="кнопка" ID="ТБЛ" значение="получить сведения" класс="БТН БТН-успех"/&ГТ;

&ЛТ;таблица ID="tblselect" атрибут runat="сервер" clientidmode="статический" класс="таблица-полосатый"и GT;
<thead><tr>
<td></td>
&ЛТ;/тр&ГТ;&ЛТ;/элементы thead&ГТ;
<tbody >
<tr>
<td></td>
</tr>
</tbody>
<tfoot><tr>
<td></td>
</tr></tfoot>
</Таблица>


</div>

Karthik_Mahalingam

измените идентификатор
$("#tblselect tbody").find('tr').remove(); ..

Rajiv.net40

большое вам спасибо сэр

Karthik_Mahalingam

работает?
если это работает, пожалуйста, закройте этот пост, пометив его как ответ.

Rajiv.net40

как я могу также выбрать имя столбца в таблице ?

Karthik_Mahalingam

значит?

Rajiv.net40

я хочу показать имя colunm также динамично..не статично, потому что я буду использовать одну таблицу для multipupose

Karthik_Mahalingam

это не по теме, закройте этот пост.
и опубликуйте новый вопрос с подробным требованием. если я осознаю это, Я помогу Вам..

Рейтинг:
1

Member 13527253 

class jamiu{
public string id{get; set;}
public string Name {get; set;}
}
public static List<jamiu> getdata(){
List<jamiu> jam=new  List<jamiu>();
SqlConnection con=new SqlConnection();
SqlCommand cmd=new SqlCommand();
cmd.connection=con;
cmd.CommandText="select *from Table";
 SqlDataReader dr=cmmd.ExecuteReader();
DataTable dt=new DataTable();
 for (Int32 i = 0; i < dt.Rows.Count; i++)
{dt.Load(dr);
jamiu jj=new jamiu();
jj.id=dt.Rows[1]["Id"].ToString();
}
 dr.Close();
        con.Close();
 


}

<скрипт>
$(документ).готово(функция () {
ВАР=документ щли.метода getElementById(schlidd).через свойство innerText;
$.Аякс({
тип:"Почта",
тип данных: "json",
URL-адрес: "по умолчанию.аспн/getbook",
сведения: "{'идентификатор':'" + щли + "'}",
успех: функция (данные) {
if (data.d.length > 0) {
$("#ДД").код HTML(");
for (var i = 0; i < data.d.length; i++) {
список ВАР = ["&ЛТ;тр&ГТ;&ЛТ;тд&ГТ;" + данные.д[Я].ИД + "&ЛТ;/тд&ГТ;&ЛТ;тд&ГТ;"];
$("#dd").append(список);
}
}
}

})
})
</script>

saranraj98

Как сделать эту работу в php?
сначала у меня есть php-код с базой данных. И у меня есть некоторый набор данных в базе данных.
как извлечь эти данные и преобразовать их в json .
затем с помощью jquery как сделать таблицу, используя этот файл json?.