Перезагрузка основного вида после нажатия кнопки в PartialView

Question

У меня есть частичное представление, что пользователь может предварительно выполнить поиск, и результаты поиска отображаются в поле выбора. На моем главном экране есть раздел, который должен показывать результаты поиска после нажатия кнопки выбора. Прямо сейчас, когда я нажимаю кнопку выбора, загружается правильная информация в правильную модель для моего основного вида, но основной вид не изменяется. Когда я нажимаю обновить, страница обновляется правильно. Как сделать так, чтобы страница обновлялась автоматически при нажатии кнопки в представлении плагина?

Мой раздел в основном виде (Index.vbhtml) в моем основном приложении:

@Section CUInfo

 Credit Union Name: @Model.CUInfo.CUName

 end section

Вот мой метод контроллера в моем плагине:

Function ChangeCUInfo(strCUName As String) As ActionResult
        m_hostApp.CUInfo.CUName = strCUName
        m_hostApp.blnPluginRefreshButtonPressed = True
        Return View("Index", m_hostApp)
    End Function

Я попытался установить логическое значение в объекте hostApp, а затем в моем главном представлении бритвы вызвать эту функцию, если это правда:

@code
     If Model.blnPluginRefreshButtonPressed = True Then


         @<script type="text/javascript">
              $(function () {
                  window.location.reload();
              });
         </script>


      End If

      Model.blnPluginRefreshButtonPressed = False
End Code

РЕДАКТИРОВАТЬ:

Функция JS вызывается при нажатии кнопки выбора:

function loadCU(CUInfo) {
           strCU = CUInfo.split('|');
           strCUName = strCU[0];         
           $.ajax({
           type: "POST",
           url: "/CUContractNumberPlugin/ChangeCUInfo",
           data: { "strCUName": strCUName }
       });
       }

Форма, которая используется в представлении плагина:

@Using (Html.BeginForm("ChangeCUInfo", "CUContractNumberPlugin"))
                 @<div id="LogoSigSearch" style="height:300px;width:500px;position:relative;">



    <span style="display:inline-block;height:20px;width:166px;position:absolute;top:35px;left:5px;">Credit Union Name</span>


    <br />
     @Html.TextBox("strCUName")
    <input type="submit" name="LogoSigSearch$ctl02" value="Search" id="LogoSigSearch_ctl02" tabindex="3" style="width:60px;position:absolute;top:5px;left:352px;" />






    <input name="LogoSigSearch$ctl05" type="button" onclick="javascript:clearSearch()" value="Clear" style="position:absolute;top:35px;left:352px;width:60px;" />

    <select size="4" name="LogoSigSearch$ctl06" id="LogoSigSearch_ctl06" tabindex="5" style="height:230px;width:342px;position:absolute;top:65px;left:5px;"></select>

    <input type="button" name="SelectCU" value="Select" onclick="javascript:loadCU(LogoSigSearch_ctl06.options[LogoSigSearch_ctl06.selectedIndex].value)"  tabindex="4" style="width:60px;position:absolute;top:65px;left:352px;" />
        </div>
    End Using

Answer 1

Являются ли обе кнопки частью формы? Кнопка не вызовет действие, если вы не присоедините его к сценарию или не сделаете его частью формы со связанным действием.

Используйте частичное представление для отображения результатов запроса даже при загрузке главной страницы. Это упрощает ваше развитие.

Добавьте обработчик события jQuery ( jQuery.on ()), чтобы отслеживать нажатие кнопки на главной странице или, если кнопка возвращается в частичном представлении, просто используйте обработчик "Готово" в своей части и присоедините button.click(), снова используя jQuery.

Обработчик событий jQuery может позаботиться о передаче значений запроса, публикации в вашем контроллере и отображении результатов. У меня здесь есть несколько старых статей, но они все еще имеют отношение к вашему вопросу и демонстрируют отправку данных и выборку партиалов.

Ваш клиентский код будет выглядеть примерно так:

 $("#your-button").click(function () {
    var fetchUrl = '@Url.Action("ActionName", "Controller")';

    $.post(fetchUrl, { searchParams: $("#your-search-box").val() })
        .success(function (data) {
          // replace the contents of the DIV with the results. 'data' 
          // here has whatever you sent back from your partial view
        })
        .error(function (data) { 
          // handle the error, use a DIV with some kind of alert message etc
        });

});

Надеюсь, это поможет некоторым.