JavaScript - 'this.form' возвращает undefined

Question

Я пытаюсь изменить функциональность части своего веб-сайта. В настоящее время у меня есть кнопка подтверждения, которая находится за пределами моей таблицы. Всякий раз, когда пользователь нажимает на эту кнопку, происходит проверка.

Однако я изменяю это так, чтобы кнопка «Проверить» была удалена, и функциональность будет перемещена на кнопку «Ссылка», которая находится внутри таблицы.

Ниже приведен код для этого:

<table width="100%" cellpadding="4"> 
<tr> 
    <td valign="top"> 
     //something else here 
    </td> 
    <td valign="top" align="right"> 
     <asp:GridView ID="myGridView" runat="server" OnRowDataBound="myGridView_RowDataBound"> 
     <Columns> 
      <asp:TemplateField HeaderText="Column 1"> 
       <ItemTemplate> 
        // some control 
       </ItemTemplate> 
      </asp:TemplateField> 
      <asp:TemplateField HeaderText="Column 2"> 
       <ItemTemplate> 
        // some control 
       </ItemTemplate> 
      </asp:TemplateField> 
      <asp:TemplateField HeaderText="Column 3"> 
       <ItemTemplate> 
        // some control 
       </ItemTemplate> 
      </asp:TemplateField> 
      <asp:TemplateField HeaderText="Column 4"> 
       <ItemTemplate> 
        <asp:LinkButton ID="lbValidate" runat="server" Text="Validate" OnClientClick="return MyValidation__Submit(this.form)" CausesValidation="true" OnClick="btnValidate_Click"></asp:LinkButton> 
       </ItemTemplate> 
      </asp:TemplateField> 
     </Columns> 
     </asp:GridView> 
    </td> 
</tr> 
</table>  
<div style="margin:10px 0px 10px 0px;"> 
    <asp:Button ID="btnValidate" runat="server" Text="Validate" OnClientClick="return MyValidation__Submit(this.form)" CommandArgument="Save" CausesValidation="true" OnClick="btnValidate_Click" /> 
</div> 

А вот пример блока JavaScript, который делает проверку:

<script type="text/javascript"> 
    function MyValidation__Submit(formName) { 
     alert("Test :" + formName); 
     // do validations 

     var joForm = document.getElementById(formName.id); 

     for (var i = 0; i < joForm.elements.length; i++) { 
      // do something 
     } 

     return true; 
    } 
</script> 

Это очень хорошо работает, когда кнопка Validate нажата, но не на LinkButton. Чтобы проверить это, мне пришлось поставить линию alert("Test :" + formName);. Всякий раз, когда я запускаю кнопку «Проверить», системное предупреждение возвращает строковое значение «[object HTMLFormElement]», которое, как я полагаю, в порядке, учитывая, что оно функционирует так, как я этого хочу. Однако, когда я пытаюсь запустить Validate LinkButton, который находится внутри таблицы, системное предупреждение возвращает «undefined», что делает весь мой код проверки бесполезным.

Может кто-нибудь указать, что я здесь отсутствует? Я предполагаю, что это имеет какое-то отношение к иерархии элементов управления, поскольку это единственное, что изменилось.

Спасибо!

EDIT:

Это далеко я могу идти, но я до сих пор не могу получить форму. Этот возвращает HTMLDivElement.

<asp:LinkButton ID="lbValidate" runat="server" Text="Validate" OnClientClick="return MyValidation__Submit(this.parentNode.parentNode.parentNode.parentNode.parentNode)" CausesValidation="true" OnClick="btnValidate_Click"></asp:LinkButton> 

Да, вы читали это право. Он имеет 5 .parentNode.

Answer 1

[править] принял ответ последнего примера

Вы говорите, что вы используете JQuery, так что если вы получили только один элемент формы на странице, почему не просто сделать?

<script type="text/javascript"> 
    function MyValidation__Submit() { 
     // do validations 
     var joForm = $('form').eq(0); 
     for (var i = 0; i < joForm.elements.length; i++) { 
      // do something 
     } 
     return true; 
    } 
</script> 

даже если у вас есть более одной формы можно сделать

<script type="text/javascript"> 
    function MyValidation__Submit(obj) { 
     // do validations 
     var joForm = $(obj).parents('form').eq(0); 
     for (var i = 0; i < joForm.elements.length; i++) { 
      // do something 
     } 
     return true; 
    } 
</script> 

и назвать его как

OnClientClick="return MyValidation__Submit(this)" 

Без JQuery вы можете вернуться к getElementsByTagName()

<script type="text/javascript"> 
    function MyValidation__Submit() { 
     // do validations 

     // getElementsByTagName("form") searches for any <form> elements on the page and returns an array of elements 
     // the [0] then selects the first one in the array that was found 
     // as long as you've only got one form on the page this should work 
     var joForm = document.getElementsByTagName("form")[0]; 

     for (var i = 0; i < joForm.elements.length; i++) { 
      // do something 
     } 
     return true; 
    } 
</script> 

Answer 2

Мои знания ASP немного рудиментарны, но я считаю, что это потому, что, когда вы используете «this.form» для вашей кнопки, область «это» является объектом документа. Но когда используется для вашего LinkButton, область действия «это» - это GridView. Если вы собираетесь перемещать элемент триггера вокруг, возможно, было бы лучше установить formName, что вы более явно переходите к функции javascript.