PDA

View Full Version : سوال: bootstrap modal



elahe1364
یک شنبه 26 مهر 1394, 08:15 صبح
با سلام
اول بگم خیلی سرچ کردم ولی جوابمو پیدا نکردم.امیدوارم بتونید کمکم کنید.
من یه سایتی طراحی کردم.میخوام زمانی که کاربر وارد سایت میشه یک فرم مودال بهش نشون داده بشه و آدرس ایمیل کاربر رو بگیره و در دیتابیس ذخیره کنه.

فعلا صفحه مودال رو با کد زیر ایجاد کردم.البته این کد اصلیم نیست.یه textbox هم دارم.

<div class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Modal title</h4>
</div>
<div class="modal-body">
<p>One fine body…</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" class="btn btn-primary">Save changes</button>
</div>
</div><!-- /.modal-content -->
</div><!-- /.modal-dialog -->
</div><!-- /.modal -->

فعلا مشکلم اینجاست که :
1-چه جوری فرم رو زمان page-load نشون بدم؟
2-چه طور آدرس ایمیل وارد شده در فرم رو ذخیره کنم؟
با تشکر

malloc
یک شنبه 26 مهر 1394, 08:28 صبح
خوب توی جاوا اسکریپت ما یه تابع داریم بصورت زیر


$( document ).ready(function() {




});





که با این میتونه توی لود صفحه اون فرم رو نشون بدی

/////////////////////////////////////
بعد شما یه input بزار توی فرم مودال...... بعد وقتی روی ارسال کلیک کرد بصورت ajax بره سمت سرور و مقدار رو ذخیره کنه

elahe1364
یک شنبه 26 مهر 1394, 12:17 عصر
خوب توی جاوا اسکریپت ما یه تابع داریم بصورت زیر


$( document ).ready(function() {




});





که با این میتونه توی لود صفحه اون فرم رو نشون بدی

/////////////////////////////////////
بعد شما یه input بزار توی فرم مودال...... بعد وقتی روی ارسال کلیک کرد بصورت ajax بره سمت سرور و مقدار رو ذخیره کنه

ممنون از پاسختون.در مورد کد ajax هم میتونید کمک کنید؟من آشنایی ندارم

malloc
یک شنبه 26 مهر 1394, 12:57 عصر
کد صفحه اچ تی ام ال ..... اسم صفحه من b.aspx هست




<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script src="Scripts/jquery-1.11.2.js"></script>
<link href="Styles/BootStrap/css/bootstrap-theme.css" rel="stylesheet" />
<link href="Styles/BootStrap/css/bootstrap.css" rel="stylesheet" />
<script src="Styles/BootStrap/js/bootstrap.min.js"></script>
<script type="text/javascript">
function SaveEmail() {
$.ajax({
type: "POST",
contentType: "application/json",
url: "b.aspx/SaveEmail",
data: "{Email:'" + document.getElementById("txtEmail").value + "'}",
dataType: "json",
success: function (result) {
alert("ok");
},
error: function (xhr, errorType, exception) {
}
}).done(function () {
});
}


$(document).ready(function () {
$('#myModal').modal();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<div id="myModal" class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title">Modal title</h4>
</div>
<div class="modal-body">
<input id="txtEmail" type="text" />
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
<button type="button" onclick="SaveEmail()" class="btn btn-primary">Save changes</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
</div>
</form>
</body>
</html>


کد سمت سی شارپ

[WebMethod]
public static bool SaveEmail(string Email)
{
//کد ذخیره سازی ایمیل
return true;
}


اینم یدوه using بالای صفحه
using System.Web.Services;


امیدوارم به کارت بیاد

elahe1364
یک شنبه 26 مهر 1394, 14:07 عصر
دقیقا همونیه که میخواستم.واقعا ممنون