PDA

View Full Version : سوال: تنظیم نحوه قرار گرفتن ستاره ها در RadAjaxManager



majid_darab
یک شنبه 15 فروردین 1389, 15:39 عصر
با سلام و عرض خسته نباشید خدمت شما دوستان عزیز و گرامی :
اگر با کنترل RadAjaxManager که یکی از کنترل های مجموعه ی تلریک می باشد کار کرده باشید ، متوجه خواهید شد که این کنترل به منظور اِیجکس مالی فرم ما بسیار UserFriendly تر از UpdatePanel می باشد و قدرت مانور ما را بسیار بالا می برد.
اما مشکلی کوچکی که در رابطه با آن وجود دارد یک مشکل Design ی می باشد که به قرار زیر است ...
فرض کنید دو تکست باکس در کنار هم در یک سلول یک ردیف از یک تیبل داریم.
موقع View In Browser این دوتکست باکس کنار هم نشان داده می شوند و اگر در کد aspx مابین دو تکست باکس از تگ </ br>استفاده کنیم این دو تکست باکس موقع View زیر هم نشان داده می شوند.
حالا وقتی یکی یا هر دو تکست باکسو به RadAjaxManger معرفی می کنم این دو تکست باکس موقع View In Broser زیر هم نشان داده می شوند بدون اینکه در کد از تگ br خبری باشد.
حالا فرض کنید به جای تکست باکس ها سی چهل تا ولیدیتور کنار یک تکست باکس داشته باشیم که تکست همه ی اونها روی * ست شده ... خوب زمانی که اونها رو به RadajaxManager معرّفی می کنم این ستاره ها زیر هم قرار می گیرن ...
در مورد دو تکست باکس مشکل اینجوری حل می شد که یه تیبل دیگه داخل تیبل مادر با یک ردیف و دو ستون (بدون هیچ عرض و ارتفاعی)بسازیم و هر کدوم از تکست باکس ها رو داخل یک سلول جداگانه قرار دهیم .
اما روش بالا در مورد ولیدیتور ها جواب نمی دهد (وقتی یکی نشان داده می شود جای بقیه خالی می مونه و این در حالی بده که اونی که نشون داده می شه در سلول آخر تیبل باشه)
خلاصه این مشکل در مورد جابجایی کلیه ی عناصر داخل فرم وجود داره ....
اگر راهنمایی بفرمایید ممنون می شم ....
آیا راه حل موضوع با خود RadAjaManager می باشد یا css یا ...
چه جوری کنترل مزبورو با طناب ببندیم که از جاش تکون نخوره؟
با تشکر - مجید داراب

mehdi.mousavi
دوشنبه 16 فروردین 1389, 13:24 عصر
سلام.
زیر هم قرار گرفتن ستاره ها دو دلیل میتونه داشته باشه:


فضای کافی برای نمایش دو ستاره (یا بیشتر) کنار هم وجود نداشته باشه، در نتیجه ستاره ها دونه به دونه شکسته میشن و به خط بعد منتقل میشن.
خصیصه display اونها روی block تنظیم شده باشه.


توی این دو حالت، ستاره ها زیر هم قرار میگیرن. اگر حالت اول باشه، باید عرض اونجاییکه ستاره ها قرار گرفته اند رو بیشتر کنید تا امکان نمایش چند ستاره کنار همدیگه وجود داشته باشه.

اگر حالت دوم باشه، باید خودتون دستی توسط CSS، خصیصه display اونها رو به inline تغییر بدید. بدین ترتیب ستاره ها در کنار همدیگه قرار میگیرن.

موفق باشید.

پاورقی: لطفا از آوردن تاپیکهای بی پاسخ با ارسال عباراتی مثل "any idea" و ... خودداری کنید.

majid_darab
دوشنبه 16 فروردین 1389, 14:00 عصر
با سلام بر شما دوست عزیز
هیچکدوم از دو دلیلی که فرمودید در این مورد صادق نیستند
عرض تیبلی که ستاره ها توش بودند رو به 800 تغییر دادم و نشد که نشد
در مورد خصیصه ی display هم چک کردم ...
در این مورد پروپرتی ای ست نشده بود...
با تشکر


پاورقی: لطفا از آوردن تاپیکهای بی پاسخ با ارسال عباراتی مثل "any idea" و ... خودداری کنید.
با عرض معذرت

mehdi.mousavi
دوشنبه 16 فروردین 1389, 14:08 عصر
سلام.
لطفا HTML تولید شده رو اینجا قرار بدید تا ببینم مشکل چی هستش. البته پر واضحه که باید CSS های مربوطه رو هم ارسال کنید.

موفق باشید.

majid_darab
پنج شنبه 19 فروردین 1389, 04:24 صبح
سلام :
من در اینجا کل کد مزبورو با حذف Validation Summary می ذارم :
1- کل کد aspx :

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="WebApplication1._Default" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!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></title>
<style type="text/css">
.style1
{
width: 100%;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
</telerik:RadScriptManager>
<div>
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="TextBox1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="TextBox1" />
<telerik:AjaxUpdatedControl ControlID="CompareValidator4" />
<telerik:AjaxUpdatedControl ControlID="CompareValidator1" />
<telerik:AjaxUpdatedControl ControlID="CompareValidator2" />
<telerik:AjaxUpdatedControl ControlID="CompareValidator3" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>
<table class="style1">
<tr>
<td width="500">
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
<asp:CompareValidator ID="CompareValidator4" runat="server" ErrorMessage="CompareValidator1"
Type="Integer" ValueToCompare="25" ControlToValidate="TextBox1">*</asp:CompareValidator>
<asp:CompareValidator ID="CompareValidator1" runat="server" ErrorMessage="CompareValidator2"
Type="Integer" ValueToCompare="25" ControlToValidate="TextBox1">*</asp:CompareValidator>
<asp:CompareValidator ID="CompareValidator2" runat="server" ErrorMessage="CompareValidator3"
Type="Integer" ValueToCompare="25" ControlToValidate="TextBox1">*</asp:CompareValidator>
<asp:CompareValidator ID="CompareValidator3" runat="server" ErrorMessage="CompareValidator4"
Type="Integer" ValueToCompare="25" ControlToValidate="TextBox1">*</asp:CompareValidator>
</td>
<td>
&nbsp;
</td>
</tr>
</table>
</div>
</form>
</body>
</html>


واما عکس آن پس از اینکه در بروزر بازش کردم : (حالت نمایش درست بدون وجود رد ایجکس منیجردر ضمیمه)

2-کل کد HTML حاصل شده با فایر فاکس (این کد مال کد ای اس پی ایکس بالاست - یعنی در حالتی که ردایجکس منیجر وجود داره و من داخل تکست باکس عدد 12 رو تایپ و اینتر کردم تا ولیدیتورها نشان داده شوند - در اینجاست که نظم موجود در ولیدیتورها به هم می ریزد و زیر هم نشان داده می شوند):

<!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><title>

</title>
<style type="text/css">
.style1
{
width: 100%;
}
</style>
</head>
<body>
<form name="form1" method="post" action="Default.aspx" onsubmit="javascript:return WebForm_OnSubmit();" id="form1">
<div>
<input type="hidden" name="RadScriptManager1_TSM" id="RadScriptManager1_TSM" value="" />
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwULLTE5NDkxNzE4MTBkZJldiOece5hZupzHpoO6cXGFv60 g" />
</div>

<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['form1'];
if (!theForm) {
theForm = document.form1;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>


<script src="/WebResource.axd?d=mCnUxYX34a9MaxF5fRQCEQ2&amp;t=633831 224213906250 (http://barnamenevis.org/forum/view-source:http://localhost:42027/WebResource.axd?d=mCnUxYX34a9MaxF5fRQCEQ2&t=633831224213906250)" type="text/javascript"></script>


<script src="/ScriptResource.axd?d=Vx-axy2gg6M6yMMeXz3vAai6YqO3_mGJLhOiZscE4UgBExN_9oIP4 ozllMbuQ52AHBTU1hzXPZIgJNVTr20ReQ2&amp;t=ffffffffee1b4 4cc (http://barnamenevis.org/forum/view-source:http://localhost:42027/ScriptResource.axd?d=Vx-axy2gg6M6yMMeXz3vAai6YqO3_mGJLhOiZscE4UgBExN_9oIP4 ozllMbuQ52AHBTU1hzXPZIgJNVTr20ReQ2&t=ffffffffee1b44cc)" type="text/javascript"></script>
<script src="/Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=R adScriptManager1_TSM&amp;compress=1&amp;_TSM_CombinedScrip ts_=%3b%3bSystem.Web.Extensions%2c+Version%3d3.5.0 .0%2c+Culture%3dneutral%2c+PublicKeyToken%3d31bf38 56ad364e35%3aen-US%3a3bbfe379-348b-450d-86a7-bb22e53c1978%3aea597d4b%3ab25378d2%3bTelerik.Web.U I%2c+Version%3d2010.1.309.35%2c+Culture%3dneutral% 2c+PublicKeyToken%3d121fae78165ba3d4%3aen-US%3a30afb63f-e6ac-41db-9851-11879733de0a%3a16e4e7cd%3aed16cbdc (http://barnamenevis.org/forum/view-source:http://localhost:42027/Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=R adScriptManager1_TSM&compress=1&_TSM_CombinedScripts_=%3b%3bSystem.Web.Extensions% 2c+Version%3d3.5.0.0%2c+Culture%3dneutral%2c+Publi cKeyToken%3d31bf3856ad364e35%3aen-US%3a3bbfe379-348b-450d-86a7-bb22e53c1978%3aea597d4b%3ab25378d2%3bTelerik.Web.U I%2c+Version%3d2010.1.309.35%2c+Culture%3dneutral% 2c+PublicKeyToken%3d121fae78165ba3d4%3aen-US%3a30afb63f-e6ac-41db-9851-11879733de0a%3a16e4e7cd%3aed16cbdc)" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
function WebForm_OnSubmit() {
if (typeof(ValidatorOnSubmit) == "function" && ValidatorOnSubmit() == false) return false;
return true;
}
//]]>
</script>

<div>

<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAgKZiPq8DgLs0bLrBkLyFBs3bbEaVV10wMqVt9kIbK8w" />
</div>
<script type="text/javascript">
//<![CDATA[
Sys.WebForms.PageRequestManager._initialize('RadSc riptManager1', document.getElementById('form1'));
Sys.WebForms.PageRequestManager.getInstance()._upd ateControls(['tTextBox1Panel','tCompareValidator4Panel','tCompa reValidator1Panel','tCompareValidator2Panel','tCom pareValidator3Panel','tRadAjaxManager1SU'], ['TextBox1'], [], 90);
//]]>
</script>

<div>
<!-- 2010.1.309.35 --><div id="RadAjaxManager1SU">
<span id="RadAjaxManager1" style="display:none;"></span>
</div>
<table class="style1">
<tr>
<td width="500">
<div id="TextBox1Panel">
<input name="TextBox1" type="text" id="TextBox1" />
</div>
<div id="CompareValidator4Panel">
<span id="CompareValidator4" style="color:Red;visibility:hidden;">*</span>
</div>
<div id="CompareValidator1Panel">
<span id="CompareValidator1" style="color:Red;visibility:hidden;">*</span>
</div>
<div id="CompareValidator2Panel">
<span id="CompareValidator2" style="color:Red;visibility:hidden;">*</span>
</div>
<div id="CompareValidator3Panel">
<span id="CompareValidator3" style="color:Red;visibility:hidden;">*</span>
</div>
</td>
<td>
&nbsp;
</td>
</tr>
</table>
</div>

<script type="text/javascript">
//<![CDATA[
var Page_Validators = new Array(document.getElementById("CompareValidator4"), document.getElementById("CompareValidator1"), document.getElementById("CompareValidator2"), document.getElementById("CompareValidator3"));
//]]>
</script>

<script type="text/javascript">
//<![CDATA[
var CompareValidator4 = document.all ? document.all["CompareValidator4"] : document.getElementById("CompareValidator4");
CompareValidator4.controltovalidate = "TextBox1";
CompareValidator4.errormessage = "CompareValidator1";
CompareValidator4.type = "Integer";
CompareValidator4.evaluationfunction = "CompareValidatorEvaluateIsValid";
CompareValidator4.valuetocompare = "25";
var CompareValidator1 = document.all ? document.all["CompareValidator1"] : document.getElementById("CompareValidator1");
CompareValidator1.controltovalidate = "TextBox1";
CompareValidator1.errormessage = "CompareValidator2";
CompareValidator1.type = "Integer";
CompareValidator1.evaluationfunction = "CompareValidatorEvaluateIsValid";
CompareValidator1.valuetocompare = "25";
var CompareValidator2 = document.all ? document.all["CompareValidator2"] : document.getElementById("CompareValidator2");
CompareValidator2.controltovalidate = "TextBox1";
CompareValidator2.errormessage = "CompareValidator3";
CompareValidator2.type = "Integer";
CompareValidator2.evaluationfunction = "CompareValidatorEvaluateIsValid";
CompareValidator2.valuetocompare = "25";
var CompareValidator3 = document.all ? document.all["CompareValidator3"] : document.getElementById("CompareValidator3");
CompareValidator3.controltovalidate = "TextBox1";
CompareValidator3.errormessage = "CompareValidator4";
CompareValidator3.type = "Integer";
CompareValidator3.evaluationfunction = "CompareValidatorEvaluateIsValid";
CompareValidator3.valuetocompare = "25";
//]]>
</script>


<script type="text/javascript">
//<![CDATA[

var Page_ValidationActive = false;
if (typeof(ValidatorOnLoad) == "function") {
ValidatorOnLoad();
}

function ValidatorOnSubmit() {
if (Page_ValidationActive) {
return ValidatorCommonOnSubmit();
}
else {
return true;
}
}
Sys.Application.initialize();
Sys.Application.add_init(function() {
$create(Telerik.Web.UI.RadAjaxManager, {"_updatePanels":"","ajaxSettings":[{InitControlID : "TextBox1",UpdatedControls : [{ControlID:"TextBox1",PanelID:""},{ControlID:"CompareValidator4",PanelID:""},{ControlID:"CompareValidator1",PanelID:""},{ControlID:"CompareValidator2",PanelID:""},{ControlID:"CompareValidator3",PanelID:""}]}],"clientEvents":{OnRequestStart:"",OnResponseEnd:""},"defaultLoadingPanelID":"","enableAJAX":true,"enableHistory":false,"links":[],"styles":[],"uniqueID":"RadAjaxManager1","updatePanelsRenderMode":0}, null, null, $get("RadAjaxManager1"));
});

document.getElementById('CompareValidator4').dispo se = function() {
Array.remove(Page_Validators, document.getElementById('CompareValidator4'));
}

document.getElementById('CompareValidator1').dispo se = function() {
Array.remove(Page_Validators, document.getElementById('CompareValidator1'));
}

document.getElementById('CompareValidator2').dispo se = function() {
Array.remove(Page_Validators, document.getElementById('CompareValidator2'));
}

document.getElementById('CompareValidator3').dispo se = function() {
Array.remove(Page_Validators, document.getElementById('CompareValidator3'));
}
//]]>
</script>
</form>
</body>
</html>


واما عکس آن پس از اینکه در بروزر بازش کردم : (حالت نمایش غلط (زیرهم) با وجود رد ایجکس منیجردر ضمیمه)

همان طور که مشاهده می فرمایید css ی در اینجا (احتمالاً) دخیل نیست و هر چی هست مربوط به کدهای جاوای تولید شده است که توسط RadAjaxManager تولید شده اند و این کدها دارن با telerik.web.ui ارتباط برقرار می کنند.

3-کد cشارپ در اینجا نداریم.

با تشکر از توجه شما

mehdi.mousavi
پنج شنبه 19 فروردین 1389, 11:42 صبح
سلام.
خوب کد HTML تولید شده، دقیقا همینو میگه که * ها زیر هم قرار بگیرن:


<div id="CompareValidator4Panel">
<span id="CompareValidator4" style="color: Red; visibility: hidden;">*</span>
</div>
<div id="CompareValidator1Panel">
<span id="CompareValidator1" style="color: Red; visibility: hidden;">*</span>
</div>
<div id="CompareValidator2Panel">
<span id="CompareValidator2" style="color: Red; visibility: hidden;">*</span>
</div>
<div id="CompareValidator3Panel">
<span id="CompareValidator3" style="color: Red; visibility: hidden;">*</span>
</div>


شما این Style رو به Head اضافه کنید، قاعدتا باید درست بشه:

<style type="text/css">
#CompareValidator4Panel, #CompareValidator1Panel, #CompareValidator2Panel, #CompareValidator3Panel {
display: inline !important;
}
</style>


موفق باشید.

majid_darab
جمعه 20 فروردین 1389, 12:39 عصر
با تشکر از رسیدگی و توجه شما
مشکل به کلّی حل شد...
فقط لطف کنید بفرمایید که در ادیتور خود از چه المنتی برای گذاشتن کد سی شارپ استفاده کردید؟
حقیقتاً پیداش نمی کنم ؟ (من از فایر فاکس استفاده می کنم)
با تشکر

mehdi.mousavi
جمعه 20 فروردین 1389, 13:48 عصر
با تشکر از رسیدگی و توجه شما مشکل به کلّی حل شد...
فقط لطف کنید بفرمایید که در ادیتور خود از چه المنتی برای گذاشتن کد سی شارپ استفاده کردید؟ حقیقتاً پیداش نمی کنم ؟ (من از فایر فاکس استفاده می کنم) با تشکر

خواهش میکنم. خوشحالم که مشکل حل شد. اما برای قرار دادن کد... لطفا به این تاپیک (http://barnamenevis.org/forum/showthread.php?t=175780) مراجعه کنید.

موفق باشید.
http://www.imgplace.com/viewimg580/255/11snapshot.png