PDA

View Full Version : سوال: بارگذاری صفحه ای در داخل صفحه با web method



r_khan
جمعه 11 مرداد 1392, 14:30 عصر
با سلام یه چند وقتی میخواستم سایتی طراحی کنم که برای رفتن به صفحات دیگر از ajax استفاده کنم ابتدا از مسترپیچ و updatepanel استفاده کردم ولی این هم جواب نداد رفتم سراغ webmethod ولی دیگر در مسترپیچ اجرا نمیشد . یه صفحهhtml ایجاد کردم و صفحه مورد نظرم رو در یک div فراخوانی کردم در صفحه ای که لود میشه رویداد کلیک باتن اجرا نمیشه.
چرا؟
کد صفحهhtml را اینجا میذارم




<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link type="text/css" href="StyleSheets/iGridView-classic.css" rel="stylesheet" />
<link type="text/css" href="StyleSheets/iGridView-common.css" rel="stylesheet" />
<script lang="javascript" type="text/javascript" src="Scripts/jquery-1.2.6.pack.js"></script>
<style type="text/css">
body
{
width:95%;
padding-left:20px;
font-family:Arial;
font-size:10pt;
padding-right:20px;
}
</style>
</head>
<body>

<input id="ss" type="button" value="Load Customer Order" onclick="getData('ScriptService.asmx/GetControlHtml', '~/Controls/WebUserControl.ascx');" />
<input type="button" value="Load Login" onclick="getData('ScriptService.asmx/GetControlHtml', '~/Controls/LoginControl.ascx');" />
<div id="testDiv"></div>


</body>
<script type="text/javascript">
/// <reference path="jquery-1.2.3.min.js" />
function getData(serviceURL, controlLocation) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: serviceURL,
data: "{'controlLocation':'" + controlLocation + "'}",
success:
function (msg) {
$('#testDiv').html(eval(msg));
formatTable();
},
error:
function (XMLHttpRequest, textStatus, errorThrown) {
alert("Error Occured!");
}
});
}

function formatTable() {
//get all row in gridview table and set style/event/attribute on them
$("div#testDiv tr")
.addClass("data-row")
.mouseover(function () {
if (!isClickedStyleSet(this.className)) {
this.className = "row-over";
}
if (!jQuery.browser.mozilla) {
this.style.cursor = "hand";
}
})
.mouseout(function () {
if (!isClickedStyleSet(this.className)) {
this.className = "data-row";
}
})
.click(
function () {
if (!isClickedStyleSet(this.className)) {
this.className = "row-select";
}
else { this.className = "data-row"; }
});
//get all cell in gridview table and set style/event/attribute on them
$("div#testDiv td")
.addClass("data-row")
.css("white-space", "nowrap")
.css("vertical-align", "middle")
.mouseover(function () {
setTitle(this);
});
}
function setTitle(object) {
//check browser type
if (jQuery.browser.mozilla) {
object.title = object.textContent;
}
else {
object.title = object.innerText;
}
}
function isClickedStyleSet(className) {
//if row is already clicked return true
if (className == "row-select") {
return true;
}
return false;
}
</script>
</html>

parvizwpf
شنبه 12 مرداد 1392, 01:34 صبح
ذاتا کاری که گفتید زیاد معنی دار نیست میتونید چیزی مثل یاهو میل بسازید که کلی کار در فضای یک قالب انجام بشه که اونم با همون jquery.ajaxانجام پذیره.

r_khan
شنبه 12 مرداد 1392, 17:36 عصر
ذاتا کاری که گفتید زیاد معنی دار نیست میتونید چیزی مثل یاهو میل بسازید که کلی کار در فضای یک قالب انجام بشه که اونم با همون jquery.ajaxانجام پذیره.

دوست عزیز میتونی یه مثال یا توضیحی بیشتری بدی ما بیشتر یاد بگیریم

r_khan
یک شنبه 13 مرداد 1392, 08:15 صبح
از اساتید خواهشمندم کمک کنند که چطور این کار را با jquery.ajax یا web method انجام بدهم

r_khan
سه شنبه 15 مرداد 1392, 09:31 صبح
از روشی دیگر هم استفاده کردم
کدش هم به صورت زیر میباشد فقط نمیدونم چرا کنترل های سمت سرور اجرا نمیشه؟؟؟
خواهشند دوستان کمک کنند



<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script src="http://code.jquery.com/jquery-1.4.2.min.js" type="text/javascript"></script>
<script type="text/javascript" src="http://github.com/malsup/blockui/raw/master/jquery.blockUI.js?v2.34"></script>
<script type="text/javascript">
$(document).ready(function () {
$('#Button1').click(function () {

var ControlName = "WebUserControl.ascx";
$.ajax({
type: "POST",
url: "LoadControl.aspx/Result",
data: "{ controlName:'" + ControlName + "'}",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function (response) {

$('#result').html(response.d);
},
error: function (msg) {

alert(msg);
$('#result').html(msg.d);
}
});
});
});
</script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<h2>
Load asp.net web user control using jquery
</h2>
<p>
<input type="button" id="Button1" value="Load Control" />
<div id="result">&nbsp;</div>
</p>
</asp:Content>