توضیحات و دانلود

تنظیم خودکار پهنای DropDownList (HTML SELECT) با استفاده از jQuery در Asp.net
0 0
تنظیم خودکار پهنای DropDownList (HTML SELECT) با استفاده از jQuery در Asp.net

با سلام این کد کوتاه به شما اجازه می دهد تا از مشکل بسیار معمولی که افراد با کنترل ASP.Net DropDownList یا HTML SELECT روبرو می شوند خلاص شوید.
موضوع
هر وقت که ما  پهنای کنترل ASP.NET DropDownList یا HTML SELECT مشخص می کنیم , اگر طول متن هر DropDownList Item یا HTML SELECT گزینه از width باشد، در ترتیب مرورگر کاراکترهای اضافی بیشتر از عرض است.
راه حل
راه حل این است که به طور خودکار پهنای کنترل ASP.NET DropDownList یا HTML SELECT را  به صورت خودکار تنظیم کنید به طوری که بزرگترین آیتم یا گزینه DropDownList یا SELECT را می توان به راحتی اصلاح کنید .
برای رسیدن به این هدف، از jQuery استفاده خواهیم کرد. ابتدا یک DropDownList و HTML SELECT را به صفحه  اضافه میکنیم .

<asp:DropDownList ID="DropDownList1" runat="server" Width="50px">
    <asp:ListItem Text="Mumbai" Value="1"></asp:ListItem>
    <asp:ListItem Text="Delhi" Value="2"></asp:ListItem>
    <asp:ListItem Text="Chandigarh City" Value="3"></asp:ListItem>
</asp:DropDownList>
<select id="Select1" style="width: 50px;">
    <option value="1">Mumbai</option>
    <option value="2">Delhi</option>
    <option value="3">Chandigarh City</option>
</select>

سپس با استفاده از jQuery  رویداد mouseover را به همه ASP.Net DropDownControls یا SELECT در صفحه اضافه می کنیم

<script type="text/javascript" src="scripts/jquery-1.4.2.js"></script>
<script type = "text/javascript">
    $(document).ready(function () {
        $("select").mouseover(function () {
            AdjustWidth(this);
        });
    });
    function AdjustWidth(ddl) {
        var maxWidth = 0;
        $("#" + ddl.id + " option").each(function (i) {
            if ($(this).text().length > maxWidth) {
                maxWidth = $(this).text().length;
            }
        });
        $(ddl).css("width", maxWidth * 8 + "px");
    }
</script>

 به محض این که DropDownList ماوس را حرکت می دهیم، روش AdjustWidth اجرا می شود که از طریق هر گزینه در ASP.Net DropDownList Control یا HTML SELECT حل می شود و گزینه یا آیتم با حداکثر طول متن برای محاسبه عرض DropDownList یا SELECT بررسی می شود  . 


دانلود
  • لینک های دانلود دوره های آموزشی تا پایان دوره قابل دانلود می باشد.
  • برای خارج کردن فایل ها از حالت فشرده از ورژن جدید نرم افزار winrar استفاده کنید.
  • برای خارج کردن فایل ها از حالت فشرده لینک های دانلودی که چندین قسمت می باشند فقط قسمت اول را از حالت فشرده خارج کنید.
  • لطفا توضیحات نوشته شده برای مطالب را با دقت بخوانید.
  • برای نمایش فیلم ها می توانید از نرم افزار هایی مانند Km Player , VLC Player یا Media Player Classic استفاده کنید.

ارسال نظر
ارسال پیام به :