Question

Winforms开发人员转换为Web开发人员。我知道关于母版页有标签的部分，不清楚的是我是否可以在我的一个内容页面中有另一个。我一直看到两个答案都在进行搜索。如果只有一个有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是传递给函数的arguement，DateRanges是给单选按钮的名称值。

在按钮中，我调用此功能：onclick ="FunctionCall('frmDateRanges')" FunctionCall仅用于描述目的，'frmDateRanges'是给表单action =“”

的名称和id

感谢您的帮助，因为我在这一点上感到难过。如果有更好的方法，请告诉我。

修剪客户端上的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>

Answer 1

您的内容页面中只能有1个runat = server表单。使用页面中的其他表单进行混乱可能比其值得更加混乱，即使它只是一个小的HTML控件形式。

话虽如此，我认为您遇到的问题是，当您尝试访问内容页面中的DOM元素时，包含这些元素的母版页已更改了您的所有ID。如果您检查渲染的表单源，您将看到id元素现在具有预先设置的内容容器ID，如下所示：

＆LT; input id =“contentAreaId_controlID”/＆gt;

这可能导致您的问题与document.getElementById（formFieldName）;

Answer 2

有几件事：

嵌套<form>元素不是合法的标记：有些浏览器比其他浏览器更宽松，但如果你这样做，你会看到奇怪的行为。
当使用ASP.NET 4下面的主页时，您会注意到页面上呈现的控件ID与您在标记中给出控件的id不完全匹配 - 它将根据需要进行更改在id上的内容占位符和（可能）在DOM树中它上面的任何其他容器。

如果可以，您应该尝试动态生成一些JavaScript，这样您就可以输出服务器控件的ClientID属性，您可能需要传递名称DateRange单选按钮 - 当你声明一个RadioButton控件时，你应该给它一个GroupName - 这样所有的单选按钮都有相同的name（而不是id），所以你可能会传入第一个选项的名称< / p>

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.
}

如何访问不是母版页的<form>？</form>

2 个答案: