2015-02-05 4 views
0

Это моя страница:Я не могу сделать Подавать с JQuery

<!DOCTYPE html> 

<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Index</title> 
    <script src="/Scripts/jquery-2.1.3.js"></script> 

    <script> 
     function DoSubmit() { 
      if ($("#noAggLabel")) { 
       $("#noAggLabel").innerHTML = ""; 
      } 
      if (this.value) { 
       $("#orderForm").submit(); 
      } 
     } 
    </script> 
</head> 
<body> 
    <div> 

<form action="/Orders/GetXML" id="orderForm" method="post">   <p> 
       <select id="OrdersSelect" name="productionOrderId" onchange="DoSubmit();"><option value="">Orders</option> 
<option value="1">Order 1</option> 
<option value="2">Order 2</option> 
<option value="3">Order 3</option> 
</select> 
      </p> 
</form> </div> 
    <div id="codesTable"> 
    </div> 
</body> 
</html> 

Я разрабатываю приложение ASP.NET MVC 5 с .NET Framework 4.5.1 и C#.

Это View, который генерирует HTML, что:

@model Models.ProductionOrderViewModel 

@{ 
    Layout = null; 
} 

<!DOCTYPE html> 

<html> 
<head> 
    <meta name="viewport" content="width=device-width" /> 
    <title>Index</title> 
    <script src="~/Scripts/jquery-2.1.3.js"></script> 
    <script> 
     function DoSubmit() { 
      if ($("#noAggLabel")) { 
       $("#noAggLabel").innerHTML = ""; 
      } 
      if (this.value) { 
       $("#orderForm").submit(); 
      } 
     } 
    </script> 
</head> 
<body> 
    <div> 
     @using (@Html.BeginForm("GetXML", "Orders", FormMethod.Post, new { id = "orderForm" })) 
     { 
      <p> 
       @Html.DropDownList("productionOrderId", 
            new SelectList(Model.ProductionOrders, "Id", "OrderNumber"), 
            "Orders", 
            new { id = "OrdersSelect", onchange = "DoSubmit();" }) 
      </p> 
     } 
    </div> 
    @if (!Model.PagingInfo.HasAggregations) 
    { 
     <div id="noAggDiv"> 
      @Html.Label("No tiene agregaciones", new { @id = "noAggLabel" }) 
     </div> 
    } 
    <div id="codesTable"> 
    </div> 
</body> 
</html> 

Почему я не могу сделать представить? Я меняю выбранное значение и ничего не происходит.

+0

Почему это не используется? ОП предоставил более чем достаточно кода и описание проблемы. Что вы еще хотите? –

ответ

5

Это потому, что функция DoSubmit не вызывается с элементом в качестве контекста. В функции this будет ссылаться на объект window.

Вы можете установить контекст при вызове функции:

onchange="DoSubmit.call(this);" 

Если связать это событие с помощью JQuery вместо атрибута onchange, контекст будет прав:

$(function(){ 
    $('#OrdersSelect').change(DoSubmit); 
}); 

Примечания стороны: Нет метода innerHTML в jQuery, вы должны использовать метод text или html для установки содержимого. Вам не нужно проверять, есть ли какой-либо элемент первым, если нет элемента, тогда объект jQuery будет пустым, поэтому вызов text на нем просто ничего не делает.

Вы должны проверить содержимое значения. Если вы просто используете его в операторе if, он будет преобразован в логическое, поэтому пустая строка по-прежнему оценивается как true.

function DoSubmit() { 
    $("#noAggLabel").text(""); 
    if (this.value != "") { 
     $("#orderForm").submit(); 
    } 
} 
+0

Спасибо. Он отлично работает! Кроме того, я исправил проблему с '" #noAggLabel ". – VansFannel

+0

@VansFannel: Также обратите внимание, что я добавил о проблеме 'if (this.value). – Guffa

4

Удалить атрибут onchange и связать через JQuery

<script> 
    function DoSubmit() { 
     if ($("#noAggLabel").length) { 
      $("#noAggLabel").html(); 
     } 
     if (this.value) { 
      $("#orderForm").submit(); 
     } 
    } 
    $(function(){ 
     $('#OrdersSelect').on('change', DoSubmit); 
    }); 
</script> 

Также добавьте .length к тесту $("#noAggLabel"), потому что он всегда возвращает объект JQuery (и всегда истинен при использовании в булевой тесте) ,

Смежные вопросы