如何使JavaScript的工作与阿贾克斯的UpdatePanel [英] How to make javascript work along with Ajax UpdatePanel

问题描述

我想添加验证我的形式。我使用AJAX控件在我的表单字段。 当我删除了更新面板和AJAX控件，我的验证开始工作，但保持这两个东西在一起时，我的验证是行不通的。我如何才能让他们一起工作？

 ＆LT;脚本类型=文/ JavaScript的＆GT;

    功能验证（）{
        变种QuestionTextArea =的document.getElementById（ctl00_ctl00_cphBody_midbox_fvInsert_txtQuestion）;

        varError =;
        如果（！IsTextBoxEmpty（QuestionTextArea，\ nQuestion文本区域不能为空））{
            警报（v​​arError）;
            的document.getElementById（ctl00_ctl00_cphBody_midbox_fvInsert_txtQuestion）专注（）。
            返回false;
        }返回true;
    }
＆LT; / SCRIPT＆GT;



    ＆LT; ASP：UpdatePanel的ID =UpdatePanel2=服务器＆GT;
            ＆LT;的ContentTemplate＆GT;

             ＆LT; ASP：文本框ID =txtQuestion=服务器MAXLENGTH =1000列=50行=5风格=宽度：380px;
             浮动：无文本='＆LT;％＃绑定（说明）％＆GT;文本模式=多行/＆GT;
             ＆LT; AjaxControl：TextBoxWatermarkExtender =服务器的TargetControlID =txtQuestion
              WatermarkCssClass =水WatermarkText =输入您的问题在这里。＆GT;
             ＆LT; / AjaxControl：TextBoxWatermarkExtender＆GT;


           ＆LT; /的ContentTemplate＆GT;
        ＆LT; / ASP：UpdatePanel的＆GT;
 

当我删除AJAX扩展和更新面板。我的文本框得到验证和使用的UpdatePanel的时候。由我没有创建JavaScript函数被调用。

解决方案

  

这是的UpdatePanel完全替换更新面板上的内容   更新。
  这意味着，那些你订阅的事件都没有   较长的认购，因为有在更新面板新的元素。
  完整的答案<一href="http://stackoverflow.com/questions/256195/jquery-document-ready-and-updatepanels/256253#256253">here

在你的页面或母版，把下面的脚本

 ＆LT;脚本类型=文/ JavaScript的＆GT;
  。Sys.WebForms.PageRequestManager.getInstance（）add_beginRequest（BeginRequestHandler）;

  功能EndRequestHandler（发件人，参数）
  {
    验证（）;
  }
＆LT; / SCRIPT＆GT;
 

I am trying to add validation on my form. I am using AJAX controls in my form fields. When I remove the Update panel and AJAX control, my validation starts working, but when keeping both the things together, my validation is not working. How could I make them work together?

<script type="text/javascript">

    function Validate() {
        var QuestionTextArea = document.getElementById("ctl00_ctl00_cphBody_midbox_fvInsert_txtQuestion");

        varError = "";
        if (!IsTextBoxEmpty(QuestionTextArea, "\nQuestion Text Area  not be Empty.")) {
            alert(varError);
            document.getElementById("ctl00_ctl00_cphBody_midbox_fvInsert_txtQuestion").focus();
            return false;
        } return true;
    }
</script>



    <asp:UpdatePanel ID="UpdatePanel2" runat="server">
            <ContentTemplate>

             <asp:TextBox ID="txtQuestion" runat="server" MaxLength="1000" Columns="50" Rows="5" Style="width: 380px;
             float: none" Text='<%# Bind("Description") %>' TextMode="MultiLine" />
             <AjaxControl:TextBoxWatermarkExtender runat="server" TargetControlID="txtQuestion"
              WatermarkCssClass="water" WatermarkText="Type your Question Here.">
             </AjaxControl:TextBoxWatermarkExtender>


           </ContentTemplate>
        </asp:UpdatePanel>

When I removes ajax extender and Update Panel. My textbox gets validated and when using UpdatePanel. No javascript function created by me is called.

解决方案

An UpdatePanel completely replaces the contents of the update panel on an update.
This means that those events you subscribed to are no longer subscribed because there are new elements in that update panel.
Full answer here

In your Page or MasterPage, put the following script

<script type="text/javascript">
  Sys.WebForms.PageRequestManager.getInstance().add_beginRequest(BeginRequestHandler);

  function EndRequestHandler(sender, args)
  {
    Validate(); 
  }   
</script>

这篇关于如何使JavaScript的工作与阿贾克斯的UpdatePanel的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！