在 WebBrowser 组件中设置日期值 RadDatePicker

Question

我有一个使用 C#.Net 开发的网页浏览器桌面应用程序。
我使用 webbrowser 组件。
我访问了一个网站，上面有一些 RadDatePicker 控件。
我需要从网络浏览器应用程序将日期值设置为 RadDatePicker。

您可以在下面看到 HTML 代码

<div id="ctl00_ContentHolder_calBirthDate_wrapper" class="RadPicker RadPicker_Simple" style="display:inline-block;width:100%;">
 <!-- 2012.3.1308.35 --><input style="visibility:hidden;display:block;float:right;margin:0 0 -1px -1px;width:1px;height:1px;overflow:hidden;border:0;padding:0;" id="ctl00_ContentHolder_calBirthDate" name="ctl00$ContentHolder$calBirthDate" type="text" class="rdfd_ radPreventDecorate" value="" title="Visually hidden input created for functionality purposes."><table cellspacing="0" class="rcTable rcSingle" summary="Table holding date picker control for selection of dates." style="width:100%;">
  <caption style="display:none;">
   RadDatePicker
  </caption><tbody><tr>
   <td class="rcInputCell" style="width:100%;"><span id="ctl00_ContentHolder_calBirthDate_dateInput_wrapper" class="riSingle RadInput RadInput_Simple" style="display:block;width:100%;"><input id="ctl00_ContentHolder_calBirthDate_dateInput" name="ctl00$ContentHolder$calBirthDate$dateInput" class="riTextBox riEnabled" onchange="javascript:CalcAge('ctl00_ContentHolder_calBirthDate','ctl00_ContentHolder_txtAge')" onblur="javascript:ValidateMExist();" type="text"><input id="ctl00_ContentHolder_calBirthDate_dateInput_ClientState" name="ctl00_ContentHolder_calBirthDate_dateInput_ClientState" type="hidden" autocomplete="off" value="{&quot;enabled&quot;:true,&quot;emptyMessage&quot;:&quot;&quot;,&quot;validationText&quot;:&quot;&quot;,&quot;valueAsString&quot;:&quot;&quot;,&quot;minDateStr&quot;:&quot;0001-01-01-00-00-00&quot;,&quot;maxDateStr&quot;:&quot;2016-12-31-00-00-00&quot;}"></span></td><td><a title="open the calendar popup." href="#" id="ctl00_ContentHolder_calBirthDate_popupButton" class="rcCalPopup">open the calendar popup.</a><div id="ctl00_ContentHolder_calBirthDate_calendar_wrapper" style="display: none"><table id="ctl00_ContentHolder_calBirthDate_calendar" summary="Calendar control which enables the selection of dates." cellspacing="0" class="RadCalendar RadCalendar_Simple" border="0">
    <caption>
     <span style="display:none;">Calendar</span>
    </caption><thead>
     <tr>
      <td class="rcTitlebar"><table cellspacing="0" summary="Title and navigation which can change and show the current year and month." border="0">
       <caption>
        <span style="display:none;">Title and navigation</span>
       </caption><thead>
        <tr style="display:none;">
         <th scope="col"></th>
        </tr>
       </thead><tbody>
 <tr>
  <td><a id="ctl00_ContentHolder_calBirthDate_calendar_FNP" class="rcFastPrev" title="<<" href="#">&lt;&lt;</a></td><td><a id="ctl00_ContentHolder_calBirthDate_calendar_NP" class="rcPrev" title="<" href="#">&lt;</a></td><td id="ctl00_ContentHolder_calBirthDate_calendar_Title" class="rcTitle">June 2016</td><td><a id="ctl00_ContentHolder_calBirthDate_calendar_NN" class="rcNext" title=">" href="#">&gt;</a></td><td><a id="ctl00_ContentHolder_calBirthDate_calendar_FNN" class="rcFastNext" title=">>" href="#">&gt;&gt;</a></td>
 </tr>
</tbody>
      </table></td>
     </tr>
    </thead><tbody>
 <tr>
  <td class="rcMain"><table id="ctl00_ContentHolder_calBirthDate_calendar_Top" class="rcMainTable" cellspacing="0" summary="Table containing all dates for the currently selected month." border="0">
 <caption>
  <span style="display:none;">June 2016</span>
 </caption><thead>
  <tr class="rcWeek">
   <th class="rcViewSel" scope="col">&nbsp;</th><th id="ctl00_ContentHolder_calBirthDate_calendar_Top_cs_1" title="Sunday" scope="col" abbr="Sun">S</th><th id="ctl00_ContentHolder_calBirthDate_calendar_Top_cs_2" title="Monday" scope="col" abbr="Mon">M</th><th id="ctl00_ContentHolder_calBirthDate_calendar_Top_cs_3" title="Tuesday" scope="col" abbr="Tue">T</th><th id="ctl00_ContentHolder_calBirthDate_calendar_Top_cs_4" title="Wednesday" scope="col" abbr="Wed">W</th><th id="ctl00_ContentHolder_calBirthDate_calendar_Top_cs_5" title="Thursday" scope="col" abbr="Thu">T</th><th id="ctl00_ContentHolder_calBirthDate_calendar_Top_cs_6" title="Friday" scope="col" abbr="Fri">F</th><th id="ctl00_ContentHolder_calBirthDate_calendar_Top_cs_7" title="Saturday" scope="col" abbr="Sat">S</th>
  </tr>
 </thead><tbody>
  <tr class="rcRow">
   <th id="ctl00_ContentHolder_calBirthDate_calendar_Top_rs_1" scope="row">23</th><td class="rcOtherMonth" title="Sunday, May 29, 2016"><a href="#">29</a></td><td class="rcOtherMonth" title="Monday, May 30, 2016"><a href="#">30</a></td><td class="rcOtherMonth" title="Tuesday, May 31, 2016"><a href="#">31</a></td><td title="Wednesday, June 01, 2016"><a href="#">1</a></td><td title="Thursday, June 02, 2016"><a href="#">2</a></td><td title="Friday, June 03, 2016"><a href="#">3</a></td><td class="rcWeekend" title="Saturday, June 04, 2016"><a href="#">4</a></td>
  </tr><tr class="rcRow">
   <th id="ctl00_ContentHolder_calBirthDate_calendar_Top_rs_2" scope="row">24</th><td class="rcWeekend" title="Sunday, June 05, 2016"><a href="#">5</a></td><td title="Monday, June 06, 2016"><a href="#">6</a></td><td title="Tuesday, June 07, 2016"><a href="#">7</a></td><td title="Wednesday, June 08, 2016"><a href="#">8</a></td><td title="Thursday, June 09, 2016"><a href="#">9</a></td><td title="Friday, June 10, 2016"><a href="#">10</a></td><td class="rcWeekend" title="Saturday, June 11, 2016"><a href="#">11</a></td>
  </tr><tr class="rcRow">
   <th id="ctl00_ContentHolder_calBirthDate_calendar_Top_rs_3" scope="row">25</th><td class="rcWeekend" title="Sunday, June 12, 2016"><a href="#">12</a></td><td title="Monday, June 13, 2016"><a href="#">13</a></td><td title="Tuesday, June 14, 2016"><a href="#">14</a></td><td title="Wednesday, June 15, 2016"><a href="#">15</a></td><td title="Thursday, June 16, 2016"><a href="#">16</a></td><td title="Friday, June 17, 2016"><a href="#">17</a></td><td class="rcWeekend" title="Saturday, June 18, 2016"><a href="#">18</a></td>
  </tr><tr class="rcRow">
   <th id="ctl00_ContentHolder_calBirthDate_calendar_Top_rs_4" scope="row">26</th><td class="rcWeekend" title="Sunday, June 19, 2016"><a href="#">19</a></td><td title="Monday, June 20, 2016"><a href="#">20</a></td><td title="Tuesday, June 21, 2016"><a href="#">21</a></td><td title="Wednesday, June 22, 2016"><a href="#">22</a></td><td title="Thursday, June 23, 2016"><a href="#">23</a></td><td title="Friday, June 24, 2016"><a href="#">24</a></td><td class="rcWeekend" title="Saturday, June 25, 2016"><a href="#">25</a></td>
  </tr><tr class="rcRow">
   <th id="ctl00_ContentHolder_calBirthDate_calendar_Top_rs_5" scope="row">27</th><td class="rcWeekend" title="Sunday, June 26, 2016"><a href="#">26</a></td><td title="Monday, June 27, 2016"><a href="#">27</a></td><td title="Tuesday, June 28, 2016"><a href="#">28</a></td><td title="Wednesday, June 29, 2016"><a href="#">29</a></td><td title="Thursday, June 30, 2016"><a href="#">30</a></td><td class="rcOtherMonth" title="Friday, July 01, 2016"><a href="#">1</a></td><td class="rcOtherMonth" title="Saturday, July 02, 2016"><a href="#">2</a></td>
  </tr><tr class="rcRow">
   <th id="ctl00_ContentHolder_calBirthDate_calendar_Top_rs_6" scope="row">28</th><td class="rcOtherMonth" title="Sunday, July 03, 2016"><a href="#">3</a></td><td class="rcOtherMonth" title="Monday, July 04, 2016"><a href="#">4</a></td><td class="rcOtherMonth" title="Tuesday, July 05, 2016"><a href="#">5</a></td><td class="rcOtherMonth" title="Wednesday, July 06, 2016"><a href="#">6</a></td><td class="rcOtherMonth" title="Thursday, July 07, 2016"><a href="#">7</a></td><td class="rcOtherMonth" title="Friday, July 08, 2016"><a href="#">8</a></td><td class="rcOtherMonth" title="Saturday, July 09, 2016"><a href="#">9</a></td>
  </tr>
 </tbody>
</table></td>
 </tr>
</tbody>
   </table><input type="hidden" name="ctl00_ContentHolder_calBirthDate_calendar_SD" id="ctl00_ContentHolder_calBirthDate_calendar_SD" value="[]"><input type="hidden" name="ctl00_ContentHolder_calBirthDate_calendar_AD" id="ctl00_ContentHolder_calBirthDate_calendar_AD" value="[[1,1,1],[2016,12,31],[2016,6,23]]"></div></td>
  </tr>
 </tbody></table><input id="ctl00_ContentHolder_calBirthDate_ClientState" name="ctl00_ContentHolder_calBirthDate_ClientState" type="hidden" value="{&quot;minDateStr&quot;:&quot;0001-01-01-00-00-00&quot;,&quot;maxDateStr&quot;:&quot;2016-12-31-00-00-00&quot;}" autocomplete="off">
</div>

在网络浏览器应用程序中，我尝试访问 dom 元素并设置日期值。
但是我收到一些错误，例如
"object doesn't support property or method 'set_selectedDate'"

我们如何解决这个问题？

HtmlElement head = browser.Document.GetElementsByTagName("head")[0];
                                HtmlElement scriptEl = browser.Document.CreateElement("script");
                                IHTMLScriptElement scriptElement = (IHTMLScriptElement)scriptEl.DomElement;
                                scriptElement.text += " function setDate(){ window.frames[0].$('#ctl00_ContentHolder_calBirthDate_dateInput').set_selectedDate(new Date('2020/10/12')) } ";
                                head.AppendChild(scriptEl);


                                browser.Document.InvokeScript("setDate");

Answer 1

已解决

HtmlElement head = browser.Document.GetElementsByTagName("head")[0];
                                HtmlElement scriptEl = browser.Document.CreateElement("script");
                                IHTMLScriptElement scriptElement = (IHTMLScriptElement)scriptEl.DomElement;
                                scriptElement.text += "function setDate(datePicker, day, month, year) { var date = new Date(year, month-1, day); $find(datePicker).set_selectedDate(date); }";
                                head.AppendChild(scriptEl);

DateTime birthDate = Convert.ToDateTime(user["BirthDay"]);

                                    browser.Document.InvokeScript("setDate", new object[] { "ctl00_ContentHolder_calBirthDate", birthDate.Day, birthDate.Month, birthDate.Year });
                                    Thread.Sleep(500);

在 WebBrowser 组件中设置日期值 RadDatePicker

set date value RadDatePicker in WebBrowser component

javascript

c#

webbrowser-control

raddatepicker

telerik-raddatepicker