脚本没有加载到对话框模式中

时间:2015-05-26 06:19:19

标签: javascript jquery asp.net

我有一个问题,为什么javascripts无法加载到模态体内。这是我的观点。

@model IEnumerable<Sys.Models.Equip_Info_vw>

@{
    ViewBag.Title = "Index";
}
<meta charset="utf-8">
<link href="@Url.Content("~/Content/themes/base/minified/jquery-ui.min.css")" rel="stylesheet" type="text/css" />
<script src="~/Scripts/jquery-ui-1.8.24.min.js"></script>
<script src="~/Scripts/actionlinks.js"></script>
<script src="~/Scripts/easytabs.js"></script>
<script type="text/javascript">
$(document).ready(function () {


    $(".editDialog").live("click", function (e) {
        var url = $(this).attr('href');
        $("#dialog-edit").dialog({
            title: 'Edit Router Detail',
            autoOpen: false,
            resizable: false,
            height: 455,
            width: 1000,
            show: { effect: 'drop', direction: "up" },
            modal: true,
            draggable: true,
            open: function (event, ui) {
                $(this).load(url);

            },
            buttons: {
                "Close": function () {
                    $(this).dialog("close");

                }
            },
            close: function (event, ui) {
                $(this).dialog('close');
            }

        });

        $("#dialog-edit").dialog('open');
        return false;
    }); 
    $(".confirmDialog").live("click", function (e) {
        var url = $(this).attr('href'); 
        $("#dialog-confirm").dialog({
            autoOpen: false,
            resizable: false,
            height: 170,
            width: 350,
            show: { effect: 'drop', direction: "up" },
            modal: true,
            draggable: true,
            buttons: {
                "OK": function () {
                    $(this).dialog("close");
                    window.location = url;

                },
                "Cancel": function () {
                    $(this).dialog("close");

                }
            }
        });

        $("#dialog-confirm").dialog('open');
        return false;
    });

    $(".viewDialog").live("click", function (e) {
        var url = $(this).attr('href');
        $("#dialog-view").dialog({
            title: 'Router Detail',

            autoOpen: false,
            resizable: false,
            height: 350,
            width: 600,
            show: { effect: 'drop', direction: "up" },
            modal: true,
            draggable: true,
            open: function (event, ui) {
                $(this).load(url);

            },
            buttons: {
                "Close": function () {
                    $(this).dialog("close");

                }
            },
            close: function (event, ui) {
                $(this).dialog('close');
            }
        });

        $("#dialog-view").dialog('open');
        return false;
    });

    $("#btncancel").live("click", function (e) {
        $("#dialog-edit").dialog('close');

    });
});
</script>

<div id="tab-container" class='tab-container'>
    <ul class='etabs'>
        <li class='tab'><a href="#tabs1">Router</a></li>
        <li class='tab'><a href="#tabs2">Registration</a></li>
   </ul>
     <div class="panel-container">
         <div id="tabs1">
            @using (Html.BeginForm("Index", "Router", FormMethod.Get))
            {

                    <b>Search  </b> <text>: &nbsp;&nbsp;</text>
                    @Html.RadioButton("searchBy","brand") <span> Brand &nbsp;&nbsp;&nbsp;  </span> 
                    @Html.RadioButton("searchBy","model") <span> Model  &nbsp;&nbsp;&nbsp; </span> 
                    @Html.RadioButton("searchBy","ip_address") <span> IP Address &nbsp;&nbsp;&nbsp;</span> 
                    @Html.RadioButton("searchBy","serial") <span> Serial No &nbsp;&nbsp;&nbsp; </span>
                    @Html.TextBox("search", ViewBag.CurrentFilter as string)  <input id="submitbtn" type="submit" value ="Search"  style="width: 65px"/>

        }
        <hr />
        <span class="counting1">Total # of Routers:  </span><span class="number1">@ViewBag.count_total</span>
        <span class="counting">Number of Active Routers: </span><span class="number"> @ViewBag.count_ac</span>
        <span class="counting">Number Inactive Routers:  </span><span class="number">@ViewBag.count_inac</span>

         <div id="loading">
            <div id="loadingcontent">
                <p id="loadingspinner">

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

        <div style="width:100%;height:400px;overflow: auto;">
         <table class="fixed_headers1">
            <tr class="tbl_tr">

                    <th style="width:14%">
                        @Html.ActionLink("Brand", "Index", new { sortOrder = ViewBag.SortBrand, currentFilter=ViewBag.CurrentFilter}, new {title = "sort brand in ascending order"})
                    </th>   
                    <th style="width:14%">
                        @Html.ActionLink("Model", "Index", new { sortOrder = ViewBag.SortModel, currentFilter=ViewBag.CurrentFilter}, new {title = "sort model in ascending order"})
                    </th>     
                    <th style="width:12%">
                        @Html.ActionLink("IP Address", "Index", new { sortOrder = ViewBag.SortIP, currentFilter=ViewBag.CurrentFilter}, new {title = "sort ip address in ascending order"})
                    </th> 
                    <th style="width:9%">
                        @Html.ActionLink("Serial No", "Index", new { sortOrder = ViewBag.SortSerial, currentFilter=ViewBag.CurrentFilter}, new {title = "sort ip serial in ascending order"})
                    </th>     
                    <th style="width:14%">
                        @Html.ActionLink("Delivery Date", "Index", new { sortOrder = ViewBag.SortVendor, currentFilter=ViewBag.CurrentFilter}, new {title = "sort Vendor in ascending order"})
                    </th>
                    <th style="width:14%">
                        @Html.ActionLink("Warranty End", "Index", new { sortOrder = ViewBag.SortWarranty, currentFilter=ViewBag.CurrentFilter}, new {title = "sort warranty in ascending order"})
                    </th>
                    <th>
                        Status
                    </th>
                    <th>
                       Actions
                    </th>

                </tr>       
              @foreach (var item in Model)
                    {

                        <tr>
                            <td>
                                @Html.DisplayFor(modelItem => item.brandname)

                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.modelname)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.rt_ip_address)
                            </td>
                            <td>
                                @Html.DisplayFor(modelItem => item.rt_serial_no)
                            </td>
                           <td>
                                @Html.DisplayFor(modelItem => item.rt_delivery_date)
                           </td>
                           <td>
                                @Html.DisplayFor(modelItem => item.rt_warranty_end)
                           </td>
                            <td>
                                @if (item.is_active == true) { 
                                    <text>Active</text>
                                }else {
                                     <text>Inactive</text>
                                }
                            </td>


                            <td>
                                @Html.ActionLink("Details", "Details", new { id = item.routers_info_id }, new { @class = "viewDialog" })      |
                                @Html.ActionLink("Edit", "Edit", new { id = item.routers_info_id}, new { @class = "editDialog"})
                                @Html.ActionLink("Delete", "Delete", new { id = item.routers_info_id }, new { @class = "confirmDialog"})
                            </td>
                        </tr>
                    }

        </table>
        </div>
         <div id="dialog-confirm" style="display: none">
            <p>
                <span class="ui-icon ui-icon-alert" style="float: left; margin: 0 7px 20px 0;"></span>
                Are you sure to delete ?
            </p>
        </div>
        <div id="dialog-edit" style="display: none">
        </div>
        <div id="dialog-view" style="display: none"></div>              

        <br /><br />
    <div id="edit-div"></div>
</div>

    <div id="tabs2" style="border:1px solid skyblue">
       @Html.Action("Create","Router")
    </div>
</div>

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

当我尝试点击编辑按钮时,没有加载javasacripts,因为我的日期选择器在那里并且它不起作用。

这是我的编辑视图:

@model Sys.Models.Equip_Info

@{
    ViewBag.title = "Edit";
}
<script src="~/Scripts/telephones.js"></script>
<script src="~/Scripts/datepicker.js"></script>
@using (Html.BeginForm("Edit_Equip","Equip", FormMethod.Post)) {
            @Html.AntiForgeryToken()
            @Html.ValidationSummary(true)               
            @Html.HiddenFor(model => model.equip_info_id)
            @Html.HiddenFor(model => model.created_by) 
            @Html.HiddenFor(model => model.created_date)
            @Html.HiddenFor(model => model.updated_by)
            @Html.HiddenFor(model => model.updated_date)
        <table class="edit-table">
            <caption id="pr-table"><b> EDIT INFORMATION </b></caption>
            <tr>
                <td class="i_name">Brand: </td><td class="td">@Html.DropDownList("rt_brand_id")</td>
                <td class="i_name">Model:</td> <td class="td"> @Html.DropDownList("rt_model_id")</td>

            </tr>
            <tr>
                 <td class="i_name">Supplier:</td><td class="td">@Html.DropDownList("rt_suppliers_id")</td>
            </tr>
            <tr>
                <td class="i_name">Address: </td><td class="td">@Html.EditorFor(model => model.rt_ip_address)</td>
                <td class="i_name">Serial Number:</td><td class="td">@Html.EditorFor(model => model.rt_serial_no)</td>
            </tr>

            <tr>
                <td class="i_name">Delivery Date</td> <td class="td"> @Html.EditorFor(model => model.rt_delivery_date)</td>
                <td class="i_name">Warranty End: </td><td class="td">@Html.EditorFor(model => model.rt_warranty_end)</td>

            </tr>
            <tr>
                <td class="i_name">Active?</td><td class="td">@Html.EditorFor(model => model.is_active)</td>
            </tr>
            <tr>
                <td>
                    <input type="submit" name="Submit" value="Update"/>
                </td>
            </tr>
        </table>

}

为什么脚本没有加载到对话框体中? 任何想法都非常感激。

datepicker的脚本在这里......

$(function () {
      $("#rt_delivery_date").datepicker();
      $("#rt_warranty_end").datepicker();
});

1 个答案:

答案 0 :(得分:0)

我看不到datepicker的脚本在哪里?

如您所知,您必须为rt_delivery_date添加代码行才能生成日期选择器!

你可能忘记写了吗?

$("[name='rt_delivery_date']").datepicker();