我有一个有趣的问题,我似乎无法弄清楚。我使用JSON从数据源获取一些数据并在窗体中显示信息。通过数据源中的数据添加“selected”属性到选项
什么是不正确的事情是,我似乎无法让jQuery将“selected”的属性添加到适当的选项。
我的问题是,如果我通过一个变量使用一些静态数据,它工作正常。这里是我的代码,它我想它做的事情:Here's a quick JS Fiddle of the below code
<ul>
<li class="item">
<label>Name</label>
<input type="text" id="txtName"></li>
<li class="item">
<label>Description</label>
<input type="text" id="txtDescription"></li>
<li class="item">
<label> Unit</label>
<select id="ddlUnit" >
<option value="blank" >Original Stuff</option>
<option value="#">#</option>
<option value="$">$</option>
<option value="%">%</option>
<option value="Days">Days</option>
<option value="Hrs">Hrs</option>
<option value="Mins">Mins</option>
<option value="Mths">Mths</option>
<option value="Qtrs">Qtrs</option>
<option value="Rate">Rate</option>
<option value="Wks">Wks</option>
<option value="Yrs">Yrs</option>
</select>
</li>
</ul>
<script type="text/javascript">
$(document).ready(function() {
$("#txtName").val('Testing Name!');
$("#txtDescription").val('Testing The Description!');
var selectedKPI = '#';
$("#ddlUnit").find("option[value='"+selectedKPI+"']").attr('selected','selected');
});
</script>
工程。它将“选定”属性添加到适当的选项。
但是!当我试图从数据源获取数据时,它不起作用。这是怎么回事?!
继承人'我的代码不起作用。该代码很好地将数据加载到“输入”字段中。当我使用警报时,我甚至可以获得正确的数据。它只是不会将“selected”属性添加到适当的选项。
<ul>
<li class="item">
<label>
Name</label>
<input type="text" id='txtName' /></li>
<li class="item">
<label>
Description</label>
<input type="text" id='txtDescription' /></li>
<li class="item">
<label>
Unit</label>
<select id='ddlUnit'>
<option value="blank">Select a KPI</option>
<option value="#">#</option>
<option value="$">$</option>
<option value="%">%</option>
<option value="Days">Days</option>
<option value="Hrs">Hrs</option>
<option value="Mins">Mins</option>
<option value="Mths">Mths</option>
<option value="Qtrs">Qtrs</option>
<option value="Rate">Rate</option>
<option value="Wks">Wks</option>
<option value="Yrs">Yrs</option>
</select>
</li>
</ul>
</div>
<script type="text/javascript">
function LoadKpiCallback(result) {
var kpi = result.d;
$("#txtName").val(kpi.KpiName);
$("#txtDescription").val(kpi.KpiDescription);
var selectedKPI = kpi.KpiUnit ;
alert(selectedKPI + "2");
$("#ddlUnit").find("option[value='"+selectedKPI+"']").attr("selected","selected");
}
function SaveSuccess() {
//close the window
CloseKendoWindow();
//refresh the parent grid
LoadKpiList();
}
function AjaxError(){
alert('There was a problem saving your KPI!');
}
function SaveKPI(){
//load kpi object from controls
var kpi = {KPI: {
KpiID :<%= Me.KpiID %>,
KpiName: $("#txtName").val(),
KpiDescription :$("#txtDescription").val(),
KpiUnit:$("#ddlUnit option:selected").text()
}};
alert(kendo.stringify(kpi));
//use ajax to save
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
async:true,
cache: false,
data: kendo.stringify(kpi),
url: "Services/RockService.svc/SaveKPI",
success: SaveSuccess,
error: AjaxError
});
}
function LoadKpi() {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
dataType: "json",
async:true,
cache: false,
data: kendo.stringify({KpiID : <%= Me.KpiID %>}),
url: "Services/RockService.svc/GetKPI",
success: LoadKpiCallback,
error: function (xhr) {
alert("Bad");
alert(xhr.responseText);
}
});
}
LoadKpi();
</script>
究竟是什么问题?为什么它会与本地数据一起工作,并且远程数据失败,但只有选择?
在此先感谢您的帮助。
select元素中是否存在所需的选项?我的意思是这个调用'$(“#ddlUnit”)。find(“option [value ='”+ selectedKPI +'']“)'return the desired option element? – papaiatis 2012-03-01 17:36:06
这是什么包含如果警报(“选项[值='”+ selectedKPI +“']”) – MyStream 2012-03-01 17:36:15
@papaiatis它工作正常,当我不使用远程数据。当我使用本地数据时,它可以毫无问题地加载它。我应该做一个JS小提琴或其他东西。这会有帮助吗? – 2012-03-01 17:37:33