مرجع تخصصی برنامه نویسان

انجمن تخصصی برنامه نویسان فارسی زبان

کاربر سایت

mahdi golzari

عضویت از 1395/07/06

مشکل در Modal

  • پنجشنبه 11 آذر 1395
  • 18:43
تشکر میکنم

با سلام و احترام؛

من با استفاده از آموزش "آموزش تصویری استفاده از مدال Bootstrap" شما این قسمت رو برای پروژه ام استفاده کردم. تو حالت کلی وقتی اطلاعات رو تکمیل میکنم مشکلی نیست و تمام قسمت ها کار می کنه، ولی یکسری از فیلدهای من اجباری هست و اگه کاربر وارد نکنه خطای اجباری بودن رو تو صفحه مدال نمایش نمیده و میره به اکشن و اونجا نمایش میده که فیلدها اجباری هست.

این رو چطوری میتونم با مدال انجام بدم که خطای اجباری بودن رو تو همون index و مدال باز شده تمایش بده؟

با تشکر از زحمت های شما

پاسخ های این پرسش

تعداد پاسخ ها : 17 پاسخ
کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • پنجشنبه 11 آذر 1395
  • 19:07

به احتمال زیاد رفرنس های Jquery Validator را یا ندارید یا صحیح رفرنس ندادید 

اونها رو بررسی کنید

کاربر سایت

mahdi golzari

عضویت از 1395/07/06

  • پنجشنبه 11 آذر 1395
  • 20:04

Jquery Validator تو bundles رفرنس داده شده و تو اکشن Create کال شده. تو خود اکشن مشکلی نداره و کار میکنه. ولی تو حالت مدال میره تو خود اکشن!!

فکر می کنم جای دیگه ای رو اشتباه کردم!!!

کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • جمعه 12 آذر 1395
  • 08:20

در مدال هم رفرنس بدید

کاربر سایت

mahdi golzari

عضویت از 1395/07/06

  • جمعه 12 آذر 1395
  • 12:17

تو مدال هم رفرنس دادم ولی بازم انجام نمیشه!!!

کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • جمعه 12 آذر 1395
  • 13:37

نمیشه مشکل رو حدس زد

کدهاتون قرار بدید تا شاید بتونم کمکی کرده باشم

کاربر سایت

mahdi golzari

عضویت از 1395/07/06

  • شنبه 13 آذر 1395
  • 15:46

سلام

کد اکشن Index:

<span dir="ltr">@model IEnumerable<Javanan_WebApplication.Models.FAQ>

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

<h2 class="title-control fix-persian-font">سوالات رایج</h2>

<p>
    <a onclick="Create()" class="btn btn-success title-action fix-persian-font">افزودن سوالات رایج جدید</a>
</p>
<table class="table table-responsive table-striped table-hover">
    <tr>
        <th class="title fix-persian-font">
            @Html.DisplayNameFor(model => model.FK_Category)
        </th>
        <th class="title fix-persian-font">
            @Html.DisplayNameFor(model => model.QuestionTitle)
        </th>
        <th class="title fix-persian-font">
            @Html.DisplayNameFor(model => model.CreateDate)
        </th>
        <th class="title fix-persian-font">
            @Html.DisplayNameFor(model => model.ModifyDate)
        </th>
        <th></th>
    </tr>

@foreach (var item in Model) {
    <tr>
        <td class="view-grid-No fix-persian-font">
            @Html.DisplayFor(modelItem => item.FaqCategory.Name)
        </td>
        <td class="view-grid fix-persian-font">
            @Html.DisplayFor(modelItem => item.QuestionTitle)
        </td>
        <td class="view-grid-No fix-persian-font">
            @Html.DisplayFor(modelItem => item.CreateDate)
        </td>
        <td class="view-grid-No fix-persian-font">
            @Html.DisplayFor(modelItem => item.ModifyDate)
        </td>
        <td class="view-grid fix-persian-font">
            <a class="btn btn-sm btn-success" onclick="Detail(@item.FaqID)">
                <i class="glyphicon glyphicon-list"></i>
            </a>
            <a class="btn btn-sm btn-warning" onclick="Edit(@item.FaqID)">
                <i class="glyphicon glyphicon-edit"></i>
            </a>
            <a class="btn btn-sm btn-danger" onclick="Delete(@item.FaqID)">
                <i class="glyphicon glyphicon-trash"></i>
            </a>
        </td>
    </tr>
}
</table>
<nav aria-label="...">
    <ul class="pagination">
        @for (int i = 1; i <= ViewBag.PageCount; i++)
        {
            <li class="@(((int)ViewBag.PageID == i) ? "active" : "")">
                @Html.ActionLink(i.ToString(), "Index", new { id = i }, new { @class = "view-grid-Pageing fix-persian-font" })
            </li>
        }
    </ul>
</nav>
<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h3 class="modal-title title-control fix-persian-font" id="myModalLabel">Modal title</h3>
            </div>
            <div class="modal-body" id="myModalBody">
            </div>
        </div>
    </div>
</div>

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
    <script>
        function Create() {
            $.ajax({
                url: "/FAQs/Create/",
                type: "Get",
                data: {}
            })
                .done(function(result) {
                    $("#myModal").modal();
                    $("#myModalLabel").html("افزودن سوالات رایج جدید");
                    $("#myModalBody").html(result);
                });
        }

        function Detail(id) {
            $.get("/FAQs/Details/" + id,
                function(res) {
                    $("#myModal").modal();
                    $("#myModalLabel").html("جزئیات سوالات رایج");
                    $("#myModalBody").html(res);

                });
        }

        function Edit(id) {
            $.get("/FAQs/Edit/" + id,
                function(res) {
                    $("#myModal").modal();
                    $("#myModalLabel").html("ویرایش سوالات رایج");
                    $("#myModalBody").html(res);

                });
        }

        function Delete(id) {
            $.get("/FAQs/Delete/" + id,
                function(res) {
                    $("#myModal").modal();
                    $("#myModalLabel").html("حذف سوالات رایج");
                    $("#myModalBody").html(res);

                });
        }
    </script>
}</span>

اینم کد اکشن CREATR:

@model Javanan_WebApplication.Models.FAQ

@{
    ViewBag.Title = "Create";
}


@using (Html.BeginForm()) 
{
    @Html.AntiForgeryToken()
    
    <div class="form-horizontal">
        @Html.ValidationSummary(true, "", new { @class = "text-danger validation fix-persian-font" })
        <div class="form-group">
            @Html.LabelFor(model => model.FK_Category, htmlAttributes: new { @class = "control-label col-md-3 title fix-persian-font" })
            <div class="col-md-9">
                @Html.DropDownList("FK_Category", null, "--- لطفاً انتخاب کنید ---", htmlAttributes: new { @class = "form-control view-grid fix-persian-font" })
                @Html.ValidationMessageFor(model => model.FK_Category, "", new { @class = "text-danger validation fix-persian-font" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.QuestionTitle, htmlAttributes: new { @class = "control-label col-md-3 title fix-persian-font" })
            <div class="col-md-9">
                @Html.EditorFor(model => model.QuestionTitle, new { htmlAttributes = new { @class = "form-control view-grid fix-persian-font", placeholder = "عنوان سوال" } })
                @Html.ValidationMessageFor(model => model.QuestionTitle, "", new { @class = "text-danger validation fix-persian-font" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Question, htmlAttributes: new { @class = "control-label col-md-3 title fix-persian-font" })
            <div class="col-md-9">
                @Html.EditorFor(model => model.Question, new { htmlAttributes = new { @class = "form-control view-grid fix-persian-font", placeholder = "سوال رایج" } })
                @Html.ValidationMessageFor(model => model.Question, "", new { @class = "text-danger validation fix-persian-font" })
            </div>
        </div>

        <div class="form-group">
            @Html.LabelFor(model => model.Answer, htmlAttributes: new { @class = "control-label col-md-3 title fix-persian-font" })
            <div class="col-md-9">
                @Html.EditorFor(model => model.Answer, new { htmlAttributes = new { @class = "form-control view-grid fix-persian-font", placeholder = "پاسخ" } })
                @Html.ValidationMessageFor(model => model.Answer, "", new { @class = "text-danger validation fix-persian-font" })
            </div>
        </div>

        <div class="form-group">
            <div class="col-md-offset-3 col-md-9">
                <input type="submit" value="ایجاد" class="btn btn-success view-grid-title fix-persian-font" />
                <button type="button" class="btn btn-default view-grid-title fix-persian-font" data-dismiss="modal">انصراف</button>
            </div>
        </div>
    </div>
}

@section Scripts {
    @Scripts.Render("~/bundles/jqueryval")
}

و کد کنترل مربوطه:

public ActionResult Index(int id = 1)
        {
            var count = _db.FAQs.Count();
            const int take = 20;
            var skip = (id - 1) * take;
            var pageCount = count / take;

            ViewBag.PageCount = pageCount;
            ViewBag.PageID = id;
            return
                View(
                    _db.FAQs.Include(f => f.FaqCategory)
                        .OrderBy(f => f.FK_Category)
                        .ThenByDescending(f => f.FaqID)
                        .Skip(skip)
                        .Take(take)
                        .ToList());
        }

        public ActionResult Create()
        {
            ViewBag.FK_Category = new SelectList(_db.FaqCategories, "CategoryID", "Name");
            return PartialView();
        }

       
        [HttpPost]
        [ValidateAntiForgeryToken]
        public ActionResult Create([Bind(Include = "FaqID,FK_Category,QuestionTitle,Question,Answer,CreateDate,ModifyDate")] FAQ fAQ)
        {
            if (ModelState.IsValid)
            {
                _db.FAQs.Add(fAQ);
                fAQ.CreateDate = DateTime.Now;
                _db.SaveChanges();
                return RedirectToAction("Index");
            }

            ViewBag.FK_Category = new SelectList(_db.FaqCategories, "CategoryID", "Name", fAQ.FK_Category);
            return PartialView(fAQ);
        }

کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • شنبه 13 آذر 1395
  • 18:18

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

به نظرم مشکلی نداره

کد رو trace کردید ؟

کاربر سایت

mahdi golzari

عضویت از 1395/07/06

  • شنبه 13 آذر 1395
  • 18:41

بلهTrace کردم

اتفاقی که می افته اینه که مدال باز میشه و get Create یا Edit اجرا میشه و وقتی بدون اینکه فیلدها پر بشه submit  می کنم قسمت post این اکشن ها اجرا میشه و چون به پارشیال ویو return داره میره اونجا بدون اینکه Validate بکنه و تو پارشیال ویو validate رو نشون میده. البته js فایل های  validator jquery هم اجرا شدن و ویژوال استادیو نشون میده که این فایل ها باز هستن!!!

کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • یکشنبه 14 آذر 1395
  • 08:59

Validator ها باید سمت کلاینت فعال شوند مشکل اینه که چرا نمیشوند

برای اینکار من از Ajax.Beginform استفاده میکنم

کاربر سایت

mahdi golzari

عضویت از 1395/07/06

  • یکشنبه 14 آذر 1395
  • 09:07

میشه لطفا بیشترتوضیح بدید.

کاربر سایت

mahdi golzari

عضویت از 1395/07/06

  • یکشنبه 14 آذر 1395
  • 14:04

لینک دوم فایل ضمیمه رو تست کنید، اونم validation کار می کنه ولی مشکل داره!!!

کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • یکشنبه 14 آذر 1395
  • 16:57

بررسی کردم

مشکل از jqueryValidation بود که رفرنس دادم درست شد

کاربر سایت

mahdi golzari

عضویت از 1395/07/06

  • یکشنبه 14 آذر 1395
  • 17:47

تو کدوم اکشن رفرنس دادید؟ چون من رفرنس میدم دفعه دوم که کلیک می کنم قبول میکنه!

رفرنس رو به این صورت زیر بدم درسته؟؟؟

@Scripts.Render("~/bundles/jqueryval")

کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • یکشنبه 14 آذر 1395
  • 17:57

مستقیم رفرنس دهید داخل مدال یا زیر اسکریپت های نمایش مدال

کاربر سایت

mahdi golzari

عضویت از 1395/07/06

  • یکشنبه 14 آذر 1395
  • 19:24

ببخشید که باز سوال می کنم

تو مدال مستقیم رفرنس دادم ولی بازم کار نکرد

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
    <script src="~/Scripts/jquery-1.10.2.min.js"></script>
    <script src="~/Scripts/jquery.validate.min.js"></script>
    <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Modal title</h4>
            </div>
            <div class="modal-body" id="bodymodal">

            </div>

        </div>
    </div>
</div>

کاربر سایت

ایمان مدائنی

عضویت از 1392/01/20

  • دوشنبه 15 آذر 1395
  • 09:37

به شکل زیر تست کنید



	
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
 
    <script src="~/Scripts/jquery.validate.min.js"></script>
    <script src="~/Scripts/jquery.validate.unobtrusive.min.js"></script>
    <div class="modal-dialog" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title" id="myModalLabel">Modal title</h4>
            </div>
            <div class="modal-body" id="bodymodal">
 
            </div>
 
        </div>
    </div>
</div>

کاربرانی که از این پست تشکر کرده اند

هیچ کاربری تا کنون از این پست تشکر نکرده است

اگر نیاز به یک مشاور در زمینه طراحی سایت ، برنامه نویسی و بازاریابی الکترونیکی دارید

با ما تماس بگیرید تا در این مسیر همراهتان باشیم :)