簡體   English   中英

使用參數在頁面中加載div的內容

[英]Load content of div in a page with parameters

我在C#/ ASP.NET MVC中有一個帶有差異過濾器的表單和一個“開始”按鈕,當我單擊按鈕時,由於使用了Ajax,根據參數,我以部分視圖顯示數據庫的數據。

在此局部視圖中,我有一個鏈接,該鏈接將參數發送到控制器以執行插入(並且單元格的顏色從綠色變為白色或從白色變為綠色),但是在插入之后,刷新了整個頁面,我只是想刷新我的局部視圖。

可能要感謝ajax嗎?

在此處輸入圖片說明

在此處輸入圖片說明

我的視圖代碼:

    @using System.Web.Script.Serialization;

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

    List<SelectListItem> listAtelier = new List<SelectListItem>();

    SelectListItem tous = new SelectListItem();
    tous.Value = "TOUS";
    tous.Text = "TOUS LES ATELIERS";
    tous.Selected = true;
    listAtelier.Add(tous);

    foreach (KeyValuePair<string, string> key in ViewData["atelier"] as Dictionary<string, string>)
    {
        SelectListItem atelier = new SelectListItem();
        atelier.Value = key.Key;
        atelier.Text = key.Value;
        listAtelier.Add(atelier);
    }

    List<SelectListItem> listIlot = new List<SelectListItem>();
    List<string> listItemIlot = new List<string>();

    foreach (KeyValuePair<string, string> key in ViewData["ilot"] as Dictionary<string, string>)
    {
        SelectListItem ilot = new SelectListItem();
        ilot.Value = key.Key;
        ilot.Text = key.Value;
        listIlot.Add(ilot);
        listItemIlot.Add(key.Value);
    }
}

@using (Ajax.BeginForm("AfficheRlog009", new AjaxOptions
{
    InsertionMode = InsertionMode.Replace,
    UpdateTargetId = "divAfficheRlog009",
    HttpMethod = "POST",
    LoadingElementId = "loadAjax"
}))
{
    <div class="row">
        <div class="col-md-9" style="padding-top:6px;">
            <a href="#" class="not-active-title">
                <u>Planning des machines</u> :
            </a>
        </div>
        <div class="col-md-3">
            <div style="margin-top:10px;"></div>
            <a href="#" class="not-active-date">
                <u>Date du document</u> : @Html.Label(DateTime.Now.ToShortDateString()) <br />
                <u>Référence</u> : <strong>rlog009.cshtml</strong>
            </a>
        </div>
    </div>

    <hr />

    <form class="form">

        <div class="row">
            <div class="col-md-4">
                <div class="form-group">
                    <label for="Tdate_d">Date de début</label>
                    @Html.TextBox("Tdate_d", DateTime.Now.ToShortDateString(), new { @class = "form-control" })
                </div>
            </div>
            <div class="col-md-4"></div>
            <div class="col-md-4"></div>
        </div>

        <div class="row">
            <div class="col-md-4">
                <div class="form-group">
                    <label for="Ddl_atelier">Atelier</label>
                    @Html.DropDownList("Ddl_atelier", listAtelier, new { @class = "form-control" })
                </div>
            </div>
            <div class="col-md-4">
                <div class="form-group">
                    <label for="Ddl_ilot">Ilot</label>
                    @Html.DropDownList("Ddl_ilot", listIlot, new { @class = "form-control" })
                </div>
            </div>
            <div class="col-md-4">
                <div class="form-group">
                    <label for="Tposte">Matricule</label>
                    @Html.TextBox("Tposte", "%", new { @class = "form-control" })
                </div>
            </div>
        </div>

        <div class="row">
            <div class="col-md-4">
                <img src="~/image/p_vert.jpg" width="28" height="25" class="img-responsive" style="border:dotted;display:inline-block;" />
                <span>>= 7h30</span>
            </div>
            <div class="col-md-4">
                <img src="~/image/p_orange.jpg" width="28" height="25" class="img-responsive" style="border:dotted;display:inline-block;" />
                <span>< 7h30</span>
            </div>
            <div class="col-md-4">
                <img src="~/image/p_blanc.jpg" width="28" height="25" class="img-responsive" style="border:dotted;display:inline-block;" />
                <span>= 0</span>
            </div>
        </div>

        <div class="row">
            <div class="col-md-4">
                <div class="form-group" style="padding-top:24px;">
                    <input type="submit" value="Lancer" id="btnLancer" class="btn btn-primary" />
                </div>
            </div>
            <div class="col-md-4"></div>
            <div class="col-md-4"></div>
        </div>
    </form>
}

<div id="divAfficheRlog009"></div>

<img id="loadAjax" src="http://www.mediaforma.com/sdz/jquery/ajax-loader.gif" style="display:none">

@* Import d'un fichier pour reformater les chaînes JSON *@
<script src="~/Scripts/ReformatString.js"></script>

@{
    JavaScriptSerializer jss = new JavaScriptSerializer();
    string ilotJSON = jss.Serialize(listItemIlot);
}

<script type="text/javascript">

    $(function () {
        $("#Tdate_d").datepicker($.datepicker.regional["fr"]);
    });

    $("#Ddl_ilot").append('<option selected="selected" value="TOUS">Tous les ilots</option>');

    var listIlotJSON = '@ilotJSON';
    listIlotJSON = formatString(listIlotJSON);
    listIlotJSON = JSON.parse(listIlotJSON);

    $("#Ddl_atelier").change(function () {

        $("#Ddl_ilot").removeAttr("disabled");
        var value = $("#Ddl_atelier").val();

        var numAtelier = value.substr(0, 2);

        $("#Ddl_ilot").children().remove();

        for (var i = 0; i < listIlotJSON.length; i++) {
            var numIlot = listIlotJSON[i].substr(0, 2);

            if (numIlot == numAtelier) {
                $("#Ddl_ilot").append('<option value="' + listIlotJSON[i].substr(0, 4) + '">' + listIlotJSON[i] + '</option>');
            }
        }
        $("#Ddl_ilot").append('<option selected="selected" value="TOUS">Tous les ilots</option>');
    });

</script>

我的部分視圖代碼:

    @using System.Globalization;
<div class="table-responsive" style="padding-top:30px;">
    <table class="table table-bordered">
        <thead>
            <tr>
                <th>POSTE</th>
                <th>CR</th>
                <th>LIBELLE</th>
                <th colspan="3">NBR EQ</th>
                <th>Machine</th>
                @foreach (string row in ViewBag.ListEnTete)
                {
                    <th>@Html.Raw(row)</th>
                }
            </tr>
        </thead>
        <tbody>
            @{
                bool isClassSuccess = true;
                string classLigne;

                foreach (List<string> item in ViewBag.ListHisto)
                {
                    if (isClassSuccess)
                    {
                        classLigne = "#dff0d8";
                        isClassSuccess = false;
                    }
                    else
                    {
                        classLigne = "#f2dede";
                        isClassSuccess = true;
                    }
                    @:<tr style='background-color:@classLigne !important; '>


                        <td>@item[0] </td>
                        <td>@item[1] </td>
                        <td>@item[2] </td>

                    for (int i = 3; i < 6; i++)
                    {
                        int eq;

                        if (i == 3)
                        {
                            eq = 1;
                            <td>@Html.Raw("<a href='/Logistique/Logistique/rlog009eq?poste=" + item[0] + "&eq=" + eq + "'>" + item[i] + "</a>") </td>
                        }
                        else if (i == 4)
                        {
                            eq = 2;
                            <td>@Html.Raw("<a href='/Logistique/Logistique/rlog009eq?poste=" + item[0] + "&eq=" + eq + "'>" + item[i] + "</a>") </td>
                        }
                        else if (i == 5)
                        {
                            eq = 3;
                            <td>@Html.Raw("<a href='/Logistique/Logistique/rlog009eq?poste=" + item[0] + "&eq=" + eq + "'>" + item[i] + "</a>") </td>
                        }


                    }
                    <td>@item[6] </td>

                    int k = 7;

                    foreach (string row in ViewBag.ListEnTete)
                    {
                        // Parsage de la chaîne en date
                        string date = row;
                        string[] arrDate = date.Split('/');

                        <td>@Html.Raw("<a id='cal' href='/Logistique/Logistique/rlog009cal?machine=" + item[6] + "&date=" + arrDate[2]+ arrDate[1] + arrDate[0]+ "'>" + item[k] + "</a>")</td>
                        k++;
                    }


                    @:</tr>
            }
            }
        </tbody>
    </table>
</div>

鏈接控制器的代碼:

    [ModuleFilter(FilterFormulaire = false, SourceFormulaire = "rlog009")]

public ActionResult rlog009cal(string machine, string date)
{
    model.setCalendrier(machine, date);

    return RedirectToAction("rlog009");
}

該動作與部分視圖的最后一個鏈接(id ='cal')有關。

預先謝謝你:)


當我替換return RedirectToAction("rlog009"); 通過return PartialView("AfficheRlog009"); ,它有效,但只顯示部分視圖,而不顯示整個頁面:

在此處輸入圖片說明

您需要返回完整局部視圖並將其加載到包含要更改的div的方法中

看一下這個

        function reFillGrid(ItemId) {
$("#CartItemGridDiv").load('@Url.Content("~/User/Items/CartItemGrid")');
        }

如果您只想更改行或單元格

可以,但是需要確保唯一性

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM