PDA

View Full Version : سوال: تغییر ID تگ های ASP.NET برای استفاده در JQuery


mehran63
دوشنبه 13 آذر 1391, 11:26 صبح
سلام

<%@ Page Language="C#‎‎‎‎‎" AutoEventWireup="true" CodeFile="Default4.aspx.cs" Inherits="Default4" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Untitled Page</title>
<script src="scripts/my-JScript.js" type="text/javascript"></script>
</head>
<body>
<form id="form1" runat="server">
<div>

<asp:DropDownList ID="DropDownList1" runat="server"
onselectedindexchanged="DropDownList1_SelectedIndexChanged" AutoPostBack="true">
<asp:ListItem>esfehan</asp:ListItem>
<asp:ListItem>tehran</asp:ListItem>
</asp:DropDownList>
<br />
<br />
<br />
<asp:DropDownList ID="DropDownList2" runat="server">
</asp:DropDownList>
<br />
<br />
<br />
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" />
<p>Hellooooo</p>
</div>
</form>
</body>
</html>

///<reference path="/scripts/jquery.js" />
$("document").ready(function () {
$("#Button1").click(function () {
$("p").hide();
});
});

همانطور که در کد بالا میبینید یک فایل جداگانه در Visual Studio به نام my-JScript.js ایجاد کردم و سورسی را برای مخفی کردن تگ "p" نوشتم ولی کد کار نکرد. یعنی وقتی روی Button مربوط به ASP کلیک میکنم هیچ اتفاقی نمی افتد. ولی وقتی از Button مربوط به Html استفاده میکنم درست کار میکند
دوستان گفتند که مشکل از اینجاست که ID تگ های ASP.NET در زمان اجرا تغییر میکند
1- از دوستان میخواهم بفرمایند راه اصولی رفع این مشکل چی هست؟
2-در اینجا من از ID در بخش Selector استفاده کردم که در زمان اجرا به مشکل بر میخوره. آیا به جای ID چیز دیگری وجود دارد تا برای تگ های مربوط به ASP.NET از آن در بخش Selector استفاده کرد؟
yekta99
دوشنبه 13 آذر 1391, 14:14 عصر
شما باید یا برای باتن یه کلاس تعریف کنید و توی جاوا اسکریپت با اون فراخوانی کنید یا از clientID استفاده کنید

مثلا برای باتن تعریف می کنید

asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" class="Button1" />

و در جاوا اسکریپت به صورت زیر فراخوانی می کنید :
$(".Button1").click(function ()

یا بدون استفاده از کلاس به صورت زیر فراخوانی می کنید :
$("#<%=Button1.ClientID %>").click(function ()
ahmad156
دوشنبه 13 آذر 1391, 16:40 عصر
دوست عزیز شما میتونینِ ClientIDMode="Static" رو تنطیم کنین id ها تغییر نمیکنن
mehran63
سه شنبه 14 آذر 1391, 12:42 عصر
سلام از روش بدون استفاده از کلاس استفاده کردم ولی کار نمیکنه
$("#<%=Button1.ClientID %>").click(function ()
yekta99
شنبه 18 آذر 1391, 10:38 صبح
سلام دوست عزیز
من تازه واردم و کار کردن با jquery رو جدیدا شروع کردم ،در مرود این دستور حق با شماست ،خودم هم توی فایل جاوااسکریپت جداگانه تست نکرده بودم (الان برای خودم هم سواله که چرا ؟) ولی وقتی توی سورس صفحه نوشته بشه جواب میده .

در این مورد سرچ کردم که علاوه بر جواب دوستمون ahmad165 ، این دستور هم جواب میده :

$('[id$="Button1"]').click(function ()

ولی یه مشکل دیگه که بهش برخوردم اینه که وقتی از کنترل های Asp برای دستوراتی مثل hide() و animate() استفاده می کنم ، به درستی جواب نمیده .
مثلا اگر دستور hide () رو برای یه input button بنویسم ف تگی رو که میخوام hide کنم ، به طور کامل hide میشه ولی اگه از باتن asp استفاده کنم hide میشه ولی بلافاصله دوباره نمایش داده میشه .

اگر اطلاعی دارید در این مورد ممنون میشم راهنمایی کنید .
mehrbani
شنبه 18 آذر 1391, 17:14 عصر
چون در صفحه ASPX متغییر #<%=Button1.ClientID %> مقدار دهی میشه و در فایل JS این دستور ناشناخته است.
mehran63
یک شنبه 19 آذر 1391, 11:09 صبح
فکر کنم اکثر دوستان از JQuery در برنامشون استفاده میکنند پس لطفا یکی بگه بالاخره چه باید کرد
نکته ها رو دوباره میگم
یک فایل JQuery وجود دارد که سورسش در اولین تایپیک هست، کارش هم که خیلی ساده است، با فشردن روی یه Button باید تگ P رو Hide کنه
مشکل اینجاست که این سورس با تگ HTML کار میکنه ولی با تگ ASP.NET کار نمیکنه سورس رو هم در بالا میتونید ببینید
Cybersilent
دوشنبه 20 آذر 1391, 11:43 صبح
اینو امتحان کنید


.button1
{
}


asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Button" CssClass="Button1" />

$("document").ready(function () {
$("#button1").click(function () {
$("p").hide();
});
});
mehran63
دوشنبه 20 آذر 1391, 12:13 عصر
نه کار نمیکنه مثل این که اصلا با تگهای ASP.NET مشکل داره
<style type="text/css">
.btn1
{
}
</style>


<asp:Button ID="Button1" CssClass="btn1" runat="server" onclick="Button1_Click" Text="Button" />

///<reference path="/scripts/jquery.js" />
$("document").ready(function () {
$(".btn1").click(function () {
$("p").toggle();
});

});
mehran63
دوشنبه 20 آذر 1391, 12:42 عصر
مسئله دیگه اینه که حتی وقتی ClientIDMode="Static" رو استفاده میکنم باز کار نمیکنه

<asp:Button ID="Button1" CssClass="btn1" ClientIDMode="Static" runat="server" onclick="Button1_Click" Text="Button" />

///<reference path="/scripts/jquery.js" />
$("document").ready(function () {
$("#Button1").click(function () {
$("p").toggle();
});

});
sanay_esh
دوشنبه 20 آذر 1391, 13:10 عصر
سلام

جهت دسترسی به id یک کنترل asp.net در سمت کلاینت با استفاده از این کد :

<script type="text/javascript">
$(document).ready(function () {
var b = $("#<%= Button1.ClientID %>");
alert(b.attr('id'));
});
</script>

حال برای اینکه بتونی یه کاری برای click یک کنترل تعریف کنی مثلا

<script type="text/javascript">
$(document).ready(function () {
$("#<%= btnSearch.ClientID %>").click(function () {
$("p").hide().nextAll("div").hide();

});

});
</script>
mehran63
دوشنبه 20 آذر 1391, 16:53 عصر
باز هم کار نمیکنه
فقط با هر بار فشردن کلید Button1 همان پیغام که در دستور گذاشتید اجرا میشود، و احتمالا با فشردن Button1 صفحه که Refresh میشود این پیغام را دوباره میدهد
میگم شاید اصلا با تگ ASP.NET مشکل داره چون در کدی که در تایپیک 11 گذاشتم میبینید که یک کلاس برای این Button معرفی کردم و در قسمت Selector در فایل JQuery از همین کلاس استفاده کردم ولی اونجا هم کار نکرد در حالی که همین روش را برای Button با تگ Html تست کردم و درست کار میکرد
yekta99
دوشنبه 20 آذر 1391, 17:48 عصر
این رو امتحان کن

$("document").ready(function () {
$('[id$="Button1"]').click(function (e) {
e.preventDefault();
$("p").hide();
});
});
mehran63
دوشنبه 20 آذر 1391, 18:26 عصر
یه دنیا ممنون بالاخره این روش جواب داد
حالا دو نکته
1- اگه میشه یه توضیحی در مورد این کد بدید که چه جوری کار میکنه
2- همانطوری که در بالا توضیح دادم و کدش رو هم گذاشتم من به جای ID از Class هم استفاده کردم و اون هم جواب نداد
2-1 چرا؟
2-2 چه راهی برای اون وجود داره تا جواب بده؟
yekta99
دوشنبه 20 آذر 1391, 18:51 عصر
1- این کد برای جلوگیری از postback بعد از کلیک شدن روی button (یا هر کنترل دیگه Asp) هست .

2- کدی که نوشتم بدون استفاده از کلاس هست ، به جای

$("#<%= Button1.ClientID %>")
این دستور

$('[id$="Button1"]')
mehran63
دوشنبه 20 آذر 1391, 18:56 عصر
میدونم به جای کلاس از ID استفاده کردی
ولی میخوام بدونم اگه زمانی خواستم از کلاس استفاده کنم چه باد بکنم
yekta99
دوشنبه 20 آذر 1391, 19:01 عصر
کدی که توی پست شماره 2 گذاشتم باید جواب بده (اینجا Button1 اسم کلاس هست )

$(".Button1")
mehran63
دوشنبه 20 آذر 1391, 19:29 عصر
این کار رو انجام دادم سورسش هم تو پست 10 گذاشتم ولی کار نکرد
yekta99
دوشنبه 20 آذر 1391, 20:32 عصر
شاید من درست منظور شما رو متوجه نمیشم .

توی پست شماره 10 شما CssClass="btn1" گذاشتید و موقعی که میخواید از کلاس استفاده کنید باید این دستور رو بنویسید

$(".btn1")

در این حالت فرقی هم نمی کنه که این باشه یا نه :

ClientIDMode="Static"
mehran63
دوشنبه 20 آذر 1391, 21:22 عصر
ببخشید اشتباه لپی بود پست شماره 9 سورس این مورد هست
yekta99
دوشنبه 20 آذر 1391, 23:16 عصر
فرقی نمیکنه ، این کد به اضافه preventDefault کار می کنه ، نمیدونم مشکل شما کجاست ؟