گاهی اوقات، ما موقعیتی برای دسترسی به کنترلهای ASP.NET سمت سرور و مقادیر آن با استفاده از اسکریپت سمت کلاینت مانند جاوا اسکریپت داریم. در این پست قصد دارم نحوه انجام این کار را با یک مثال ساده توضیح دهم.
چند کلمه در مورد Client ID
همانطور که همه ما می دانیم کنترل های سمت سرور توسط موتور ASP.NET ارسال و پردازش می شوند که HTML مربوطه را به مرورگر ارسال می کند. در آن زمان موتور ASP.NET کنترل های سرور را می گیرد و شناسه (که می تواند در نسخه های ASP.NET متفاوت باشد) برای آن ارائه می کند.
مثال زیر را در نظر بگیرید که دارای 3 کادر متنی است، زمانی که کاربر روی دکمه کلیک می کند مقادیر را در 2 جعبه متن اول وارد می کند و سپس تابع جاوا اسکریپت فراخوانی می شود که مقادیر را اضافه می کند و آن را در کادر متنی سوم قرار می دهد. این کنترل ها کنترل های سرور هستند.
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head runat="server">
- <title></title>
- <script type="text/javascript">
- function Add()
- {
- var intFirstNo = document.getElementById("<%= txtFirstNo.ClientID %>")
- .value;
- var intSecondNo = document.getElementById("<%= txtSecondNo.ClientID %>")
- .value;
- var intResult = parseInt(intFirstNo) + parseInt(intSecondNo);
- document.getElementById("<%= txtResult.ClientID %>")
- .value = intResult;
- }
- </script>
- </head>
- <body>
- <form id="form1" runat="server">
- <table>
- <tr>
- <td> Enter First Number: </td>
- <td>
- <asp:textbox clientidmode="Predictable" id="txtFirstNo" runat="server"></asp:textbox>
- </td>
- </tr>
- <tr>
- <td> Enter Second Numer: </td>
- <td>
- <asp:textbox id="txtSecondNo" runat="server"></asp:textbox>
- </td>
- </tr>
- <tr>
- <td> Addition is: </td>
- <td>
- <asp:textbox id="txtResult" runat="server"></asp:textbox>
- </td>
- </tr>
- <tr>
- <td align="center" colspan="2">
- <asp:button id="btnResult" onclientclick="Add(); return false;" runat="server" text="Calculate"> </asp:button>
- </td>
- </tr>
- </table>
- </form>
- </body>
- </html>
این خط جاوا اسکریپت را در نظر بگیرید:
- var intFirstNo = document.getElementById("<%= txtFirstNo.ClientID %>").value;
وقتی خط بالا توسط موتور ASP.NET خوانده شود، شناسه کنترل سرور "txtFirstNo" را جستجو می کند و شناسه مشتری مربوطه را که توسط موتور ASP.NET اختصاص داده شده است، دریافت می کند. به عبارت دیگر، ASP.NET شناسه کلاینت را برای کنترل سرور «txtFirstNo» دریافت میکند و بین دو گیومه آن را جایگزین میکند. در نتیجه هنگام مشاهده منبع مشاهده صفحه می توانیم موارد فوق را به صورت زیر بخوانیم:
- var intFirstNo = document.getElementById("txtFirstNo").value;
همچنین پس از فراخوانی تابع جاوا اسکریپت «افزودن»، false را (در خط شماره 42) برمیگردانیم تا وقتی روی دکمه کلیک میکنیم، از پسبازگشت جلوگیری کنیم.
فقط نمونه بالا را در یک فرم وب کپی کنید و خودتان آن را امتحان کنید. لطفا نظر ارزشمند خود را بگذارید که هر مقاله را بهبود می بخشد.
کد نویسی مبارک!