Как получить доступ к <form>, который не является главной страницей <form>? - PullRequest
2 голосов
/ 18 марта 2010

Winforms разработчик превращается в веб-разработчик. Я знаю часть о главной странице, имеющей тег, но неясно, могу ли я иметь или не иметь другую на одной из своих страниц контента. Я видел оба ответа, делая поиски. Я вижу, что да, если только у одного есть runat = server. Дело в том, что у меня есть несколько переключателей на веб-странице с главной страницей. У меня есть файл .js, в котором есть функция, если я отправляю имя в нее, он будет проходить через элементы управления в форме, чтобы увидеть, какой из них выбран, и вернуть желаемый горизонт даты (MTD, QTD, YTD и т. Д.). Когда я запускаю это на не главной странице веб-страницы, она работает нормально. Тем не менее, когда я запускаю веб-страницу с главной страницей, я не могу добраться до элемента. Я пытался getElementByID, я пробовал циклически проходить по элементам страницы и т. Д. Может быть, я делаю это неправильно, и я надеюсь, что кто-то может исправить меня.

Вот код из моего файла .js, который может помочь объяснить, что я пытаюсь сделать немного лучше.

var frmDateRanges = document.getElementById(formFieldName); 
var chosen;
var len = frmDateRanges.DateRanges.length;
for(i=0;i<len;i++) 
   {
    if(frmDateRanges.DateRanges[i].checked) 
      {
        chosen = frmDateRanges.DateRanges[i].value;
       }
    }

где formFieldName - аргумент, который передается в функцию, а DateRanges - значение имени, присвоенное переключателям.

В кнопке, которую я вызываю, у меня есть эта функция: onclick ="FunctionCall('frmDateRanges')" FunctionCall только для целей описания, 'frmDateRanges' - это имя и идентификатор, присвоенные форме action = ""

Спасибо за помощь, так как я в данный момент в тупике. Если есть лучший способ сделать это, пожалуйста, дайте мне знать об этом.


Обрезанный HTML-код на клиенте

var theForm = document.forms['aspnetForm'];

if (! TheForm) { theForm = document.aspnetForm; } function __doPostBack (eventTarget, eventArgument) { if (! theForm.onsubmit || (theForm.onsubmit ()! = false)) { theForm .__ EVENTTARGET.value = eventTarget; theForm .__ EVENTARGUMENT.value = eventArgument; theForm.submit (); } }

 <form id = "frmDateRanges" action = "">
        <dl>
            <dt>&nbsp;Begin Date: &nbsp; &nbsp; End Date:</dt><dd><input name="ctl00$ContentPlaceHolder1$wpSettings$beginDT" type="text" id="ctl00_ContentPlaceHolder1_wpSettings_beginDT" style="width:67px;" />
                &nbsp;&nbsp;
                <input name="ctl00$ContentPlaceHolder1$wpSettings$endDT" type="text" id="ctl00_ContentPlaceHolder1_wpSettings_endDT" style="width:67px;" />
                &nbsp;
                <input id="btnBackOneDateRange" name = "btnBackOneDateRange" style="width: 20px; height: 21px" type="button"
                    value="<" onclick="BackOneDateRange('ctl00_ContentPlaceHolder1_wpSettings_beginDT', 'ctl00_ContentPlaceHolder1_wpSettings_endDT', 'frmDateRanges');"/>
                <input id="btnForwardOneDateRange" style="width: 20px; height: 21px" type="button"
                    value=">" /></dd><dd>

                        &nbsp;
                        <input type="radio" id="btnTrl1Yr" name="DateRanges" style="width: 19px"  value="1" onclick="GetTrailingYears('ctl00_ContentPlaceHolder1_wpSettings_beginDT', 'ctl00_ContentPlaceHolder1_wpSettings_endDT','1');" />
                        1 Year
                        <input type="radio" id="btnTrl3Yr" name="DateRanges" style="width: 19px"  value="3" onclick="GetTrailingYears('ctl00_ContentPlaceHolder1_wpSettings_beginDT', 'ctl00_ContentPlaceHolder1_wpSettings_endDT','3');" />
                        3 Years &nbsp;
                        <input type="radio" id="btnTrl5Yr" name="DateRanges" style="width: 19px"  value="5" onclick="GetTrailingYears('ctl00_ContentPlaceHolder1_wpSettings_beginDT', 'ctl00_ContentPlaceHolder1_wpSettings_endDT','5');" />
                        5 Years
                        <input type="radio" id="btnTrl10Yr" name="DateRanges" style="width: 19px"  value="10" onclick="GetTrailingYears('ctl00_ContentPlaceHolder1_wpSettings_beginDT', 'ctl00_ContentPlaceHolder1_wpSettings_endDT','10');" />
                        10 Years</dd><dt><input type="radio" id="btnMthToDate" name="DateRanges" style="width: 19px"  value="mth" onclick="GetMonthToDate('ctl00_ContentPlaceHolder1_wpSettings_beginDT', 'ctl00_ContentPlaceHolder1_wpSettings_endDT');" />
                            Month&nbsp;
                            <input type="radio" id="btnQtrToDate" name="DateRanges" style="width: 19px"  value="mth" onclick="GetQuarterToDate('ctl00_ContentPlaceHolder1_wpSettings_beginDT', 'ctl00_ContentPlaceHolder1_wpSettings_endDT');" />
                            Quarter &nbsp;<input type="radio" id="btnYearToDate" name="DateRanges" style="width: 19px"  value="mth" onclick="GetYearToDate('ctl00_ContentPlaceHolder1_wpSettings_beginDT', 'ctl00_ContentPlaceHolder1_wpSettings_endDT');" />
                            Calendar Year</dt></dl>

      </div> 
   </form>

Ответы [ 2 ]

3 голосов
/ 18 марта 2010

Вы можете иметь только 1 runat = форму сервера на вашей странице контента. Беспорядок с другими формами на странице может быть более запутанным, чем его ценность, даже если это небольшая форма управления HTML.

При этом я думаю, что вы столкнулись с проблемой, заключающейся в том, что при попытке доступа к элементу DOM на странице содержимого главная страница, содержащая элементы, изменила все ваши идентификаторы. Если вы проверите источник вашей визуализированной формы, вы увидите, что элементы id теперь имеют идентификатор контейнера содержимого, как показано ниже:

Это может быть причиной проблемы с document.getElementById (formFieldName);

2 голосов
/ 18 марта 2010

Пара вещей:

  1. Наличие вложенных элементов <form> не является допустимой разметкой: некоторые браузеры относятся к этому более снисходительно, чем другие, но при этом вы увидите странное поведение.
  2. При использовании мастер-страниц ниже ASP.NET 4 вы заметите, что идентификаторы элементов управления, отображаемые на странице, точно не соответствуют id, который вы дали элементу управления в разметке, - он будет изменен в зависимости от идентифицировать заполнитель содержимого и (потенциально) любые другие контейнеры над ним в дереве DOM.

Если вы можете, постарайтесь динамически сгенерировать для вас часть своего JavaScript, чтобы вы могли вывести свойство ClientID элементов управления вашего сервера, вам, вероятно, придется передать имя радио DateRange. кнопки - когда вы объявляете элемент управления RadioButton, вы должны присвоить ему GroupName - таким образом, все переключатели имеют одинаковый name (а не id), так что вы можете передать имя первой опции

FunctionCall('<%=Option1.ClientID%>');

Затем вы можете вызвать document.GetElementById для этого объекта и запросить свойство .name, чтобы получить имя коллекции переключателей, и вызвать document.getElementsByName с этим значением:

function FunctionCall(radioButtonId) {
  var radioButtonList = document.getElementById(radioButtonId).name;
  var radioButtons = document.getElementsByName(radioButtonList);
  // radioButtons is an array of input type=radio, iterate as needed.
}
...