2

我正在尝试动态创建文本框。所以我通过 AJAX 函数调用它。

这是我的代码：

阿贾克斯函数

function ChangedAdults(noofAdults) {
    alert(noofAdults.value);
    $.ajax({

        type: 'POST',
        dataType: 'json',
        url: "/FlightBooking.aspx/Adults",

        data: "{noOfAdults:'" + noofAdults.value +  "'}",
        contentType: "application/json; charset=utf-8",
        success: function (result) {
                     $("#AdultsList").html(result.d);
                 },
        error: function (xhr, ajaxOptions, thrownError) {
                   alert(xhr.status);
                   alert(thrownError);
               }
    });
}

后面的代码

[WebMethod]
public static string Adults(int noOfAdults)
{
    FlightBooking obj = new FlightBooking();
    obj.CreateAdultsList(noOfAdults);          

    string test= "";
    return test.ToString();
}
private void CreateAdultsList(int noOfAdults)
{
    int n = noOfAdults;
    for (int i = 0; i < n; i++)
    {
        TextBox MyTextBox = new TextBox();                      
        MyTextBox.ID = "tb" + "" + i;    
        AdultsListPlaceholder.Controls.Add(MyTextBox); //error coming here
        AdultsListPlaceholder.Controls.Add(new LiteralControl("<br />"));
    }
}

但我收到一个错误：

你调用的对象是空的

什么可能导致这个问题？

4

4 回答 4

4

您不能使用 JQuery AJAX 向页面动态添加控件。请充分了解asp.net页面生命周期

简而言之，这就是 asp.net 页面的工作方式。

  1. 浏览器向服务器发送请求。IEhttp://localhost/test.aspx
  2. 服务器为页面类创建一个对象。在这种情况下，类是Test
  3. 该对象呈现页面。这意味着它将Controlsof转换为test.aspx浏览器可以理解的 HTML。
  4. 服务器将呈现的 HTML 发送回浏览器并销毁该对象。
  5. 浏览器显示页面。

所以服务器每次收到页面请求时都会创建一个新对象。

WebMethods但是，当使用 AJAX进行调用时，不会创建页面对象。这就是为什么Webmethods必须是静态的。

我可以看到您正在尝试自己创建一个对象并将动态控件添加到该对象。但这个对象与浏览器中显示的内容无关。因此，向该对象添加控件不会改变浏览器中显示的任何内容。为此，您必须将整个页面发回。如果你返回你创建的对象的渲染输出Response.Write，那将返回整个页面的 HTML 版本。这基本上与a相同PostBack

但是，您可以使用 UpdatePanel 实现基于 AJAX 的动态控件呈现。以下是一种方法

ASPX 页面

<form id="form1" runat="server">
    <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
    <asp:UpdatePanel ID="UpdatePanel1" runat="server">
        <ContentTemplate>
            <asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
             <asp:Button ID="btnCreate" runat="server" Text="Create" OnClick="btnCreate_Click" />
        </ContentTemplate>            
    </asp:UpdatePanel>
    <asp:Button ID="btnRead" runat="server" Text="Read" OnClick="btnRead_Click" />
    <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</form>

代码背后

protected int NumberOfControls
{
    get { return Convert.ToInt32(Session["noCon"]); }
    set { Session["noCon"] = value.ToString(); }
}

private void Page_Init(object sender, System.EventArgs e)
{
    if (!Page.IsPostBack)
        //Initiate the counter of dynamically added controls
        this.NumberOfControls = 0;
    else
        //Controls must be repeatedly be created on postback
        this.createControls();
}
private void Page_Load(object sender, System.EventArgs e)
{

}

protected void btnCreate_Click(object sender, EventArgs e)
{
    TextBox tbx = new TextBox();
    tbx.ID = "txtData"+NumberOfControls;
    NumberOfControls++;

    PlaceHolder1.Controls.Add(tbx);
}
protected void btnRead_Click(object sender, EventArgs e)
{
    int count = this.NumberOfControls;

    for (int i = 0; i < count; i++)
    {
        TextBox tx = (TextBox)PlaceHolder1.FindControl("txtData" + i.ToString());
        //Add the Controls to the container of your choice
        Label1.Text += tx.Text + ",";
    }
}

private void createControls()
{
    int count = this.NumberOfControls;

    for (int i = 0; i < count; i++)
    {
        TextBox tx = new TextBox();
        tx.ID = "txtData" + i.ToString();
        //Add the Controls to the container of your choice
        PlaceHolder1.Controls.Add(tx);
    }
}

希望这可以帮助。

于 2013-04-08T05:08:53.000 回答
0

AdultsListPlaceholder为 null，您需要重写其 onload 函数来创建该控件的子控件。例如

protected override void OnLoad(EventArgs e)
    {
        base.OnLoad(e);
       CreateAdultsList(5);
    }
于 2013-04-08T04:07:16.430 回答
0

在 asp.net 中，您不能从 jQuery 或 java-script 创建服务器控件。
虽然你可以从 jQuery 调用 web-method，但是你不能从 web 方法中添加任何控件。
更多细节
用 jQuery 添加新的 ASP.NET 服务器控件？

它创建的一个想法textbox是创建 htmltextbox 

<input type="text" id="text1" ></input>

并通过 jQuery ajax 发布您的值进行操作。

编辑 1

另一种方法是在页面加载时创建所有控件（如果您知道最大数量）
最初隐藏它们
在按钮单击时一个一个显示
并在回发后在服务器上获取值。

示例：
使用 jQuery 向 asp.net 文本框控件添加文本

于 2013-04-08T04:08:44.460 回答
0

你正在混合你的范式。你希望这段代码做什么？您可以呈现控件以响应 AJAX 调用，但您必须手动将处理后的 HTML 插入 DOM。

  1. 使用 AJAX 调用服务器
  2. 实例化一个虚拟页面容器
  3. 渲染服务器控制
  4. 返回标记
  5. 插入 DOM

或者，您可以通过完整回发或异步回发（例如 ）添加新控件以响应服务器事件UpdatePanel。

于 2013-04-08T04:11:28.607 回答