如何显示查找列以显示正确的字符串? [英] How do I display lookup columns to show the proper string?
本文介绍了如何显示查找列以显示正确的字符串?的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
早上好.我有一个用javascript代码填充的自定义Web部件，该功能基本上是在下面视图中不存在的列上模拟Excel(我知道，这听起来不切实际，但这是已分配的内容).
Good Morning. I have a custom web part filled with javascript code, the function is basically to emulate Excel on columns not present in a view below (I know, this sounds non practical but it's what was assigned).
我总共有五列:
- 损坏类型
- 工具状态
- 组件
- 修复类型
- 程序
损坏类型和工具状态正好填充了元数据在文档库中反映的内容.
Damage Type and Tool Status are populating exactly what the metadata reflects in the document library.
组件，修复类型和程序都显示[object Object]，而不是应显示的正确字符串.
Components, Repair Type, and Program all display [object Object] and not the proper string that it should.
该下拉功能也无法正常运行，并且在我什至没有选择任何内容之前，在下面显示损害类型".
The drop-down feature is also not functioning the way it should and is displaying Damage Type below before I even select anything please see photo.
任何帮助将不胜感激.我一点都不懂javascript.我绝不是开发人员.两个人刚离开我们的团队，这是我受命执行此任务的唯一原因，仅仅是让某人工作"，完成任务.在上面.
Any help would be greatly appreciated. I don't know javascript at all. I'm by no means a developer. Two people just left our team which is the only reason I've been tasked this assignment, simply to have someone "working" on it.
<script type="text/javascript" src="https://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.3.min.js"></script>
<script type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/4.0/1/MicrosoftAjax.js"></script>
<script type="text/javascript" src="sites/DevSite/_layouts/15/sp.runtime.js"></script>
<script type="text/javascript" src="sites/DevSite/_layouts/15/sp.js"></script>
<div>
<table id="myTable">
<tr>
<th style="padding-right:20px"> </th>
<!-- <th style="padding-right:20px">Title</th>
<th style="padding-right:20px">Description</th>
--> <th style="padding-right:20px">DamageType</th>
<th style="padding-right:20px">Tool Status</th>
<th style="padding-right:20px">Components</th>
<th style="padding-right:20px">Repair Type</th>
<th style="padding-right:20px">Program</th>
</tr>
<tr>
<td></td>
<!-- <td>
<select id="TitleSelection">
</select>
</td>
<td>
<select id="DescriptionSelection">
</select>
</td>
--> <td>
<select id="DamageType">
</select>
</td>
<td>
<select id="ToolStatusSelection">
</select>
</td>
<td>
<select id="ComponentSelection">
</select>
</td>
<td>
<select id="RepairTypeSelection">
</select>
</td>
<td>
<select id="ProgramSelection">
</select>
</td>
</tr>
<tbody id="tbody">
</tbody>
</table>
</div>
<script>
var siteUrl = 'https://c-lite.utas.utc.com/sites/AERO_AMTS/';
var clientContext;
var collListItem;
var collListItems;
$(function () {
clientContext = new SP.ClientContext(siteUrl);
var oList = clientContext.get_web().get_lists().getByTitle('Analysis Tools');
var camlQuery = SP.CamlQuery.createAllItemsQuery();
collListItem = oList.getItems(camlQuery);
clientContext.load(collListItem);
clientContext.executeQueryAsync(getAllListItemSucceeded, getAllListItemFailed);
/* $("#TitleSelection").change(function () {
var Title = $("#TitleSelection").val();
var Description = $("#DescriptionSelection").val();
var DamageType = $("#DamageType").val();
var ToolStatus = $("#ToolStatus").val();
var Components = $("#Components").val();
var RepairType = $("#RepairType").val();
var Program = $("#Program").val();
var camlQuery = new SP.CamlQuery();
var camlString = " <ViewFields>" +
"<FieldRef Name='ID' />" +
"<FieldRef Name='Title' />" +
"<FieldRef Name='Description' />" +
"<FieldRef Name='DamageType' />" +
"<FieldRef Name='ToolStatus' />" +
"<FieldRef Name='Components' />" +
"<FieldRef Name='RepairType' />" +
"<FieldRef Name='Program' />" +
"</ViewFields>" +
"<Where>" +
"<And>" +
"<And>" +
"<Eq>" +
"<FieldRef Name='Title' />" +
"<Value Type='Text'>" + Title + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='DescriptionSelection' />" +
"<Value Type='Text'>" + DescriptionSelection + "</Value>" +
"</Eq>" +
"</And>" +
"<Eq>" +
"<FieldRef Name='DamageType' />" +
"<Value Type='Text'>" + DamageType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='ToolStatus' />" +
"<Value Type='Text'>" + ToolStatus + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Components' />" +
"<Value Type='Text'>" + Components + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='RepairType' />" +
"<Value Type='Text'>" + RepairType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Program' />" +
"<Value Type='Text'>" + Program + "</Value>" +
"</Eq>" +
"</And>" +
"</Where>";
camlQuery.set_viewXml(camlString);
collListItem = oList.getItems(camlQuery);
clientContext.load(collListItem);
clientContext.executeQueryAsync(getListItemSucceeded, getListItemFailed);
});
$("#DescriptionSelection").change(function () {
var Title = $("#TitleSelection").val();
var Description = $("#DescriptionSelection").val();
var DamageType = $("#DamageType").val();
var ToolStatus = $("#ToolStatus").val();
var Components = $("#Components").val();
var RepairType = $("#RepairType").val();
var Program = $("#Program").val();
var camlQuery = new SP.CamlQuery();
var camlString = " <ViewFields>" +
"<FieldRef Name='ID' />" +
"<FieldRef Name='Title' />" +
"<FieldRef Name='Description' />" +
"<FieldRef Name='DamageType' />" +
"<FieldRef Name='ToolStatus' />" +
"<FieldRef Name='Components' />" +
"<FieldRef Name='RepairType' />" +
"<FieldRef Name='Program' />" +
"</ViewFields>" +
"<Where>" +
"<And>" +
"<And>" +
"<Eq>" +
"<FieldRef Name='Title' />" +
"<Value Type='Text'>" + Title + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='DescriptionSelection' />" +
"<Value Type='Text'>" + DescriptionSelection + "</Value>" +
"</Eq>" +
"</And>" +
"<Eq>" +
"<FieldRef Name='DamageType' />" +
"<Value Type='Text'>" + DamageType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='ToolStatus' />" +
"<Value Type='Text'>" + ToolStatus + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Components' />" +
"<Value Type='Text'>" + Components + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='RepairType' />" +
"<Value Type='Text'>" + RepairType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Program' />" +
"<Value Type='Text'>" + Program + "</Value>" +
"</Eq>" +
"</And>" +
"</Where>";
camlQuery.set_viewXml(camlString);
collListItem = oList.getItems(camlQuery);
clientContext.load(collListItem);
clientContext.executeQueryAsync(getListItemSucceeded, getListItemFailed);
});
*/
$("#DamageType").change(function () {
// var Title = $("#TitleSelection").val();
// var Description = $("#DescriptionSelection").val();
var DamageType = $("#DamageType").val();
var ToolStatus = $("#ToolStatus").val();
var Components = $("#Components").val();
var RepairType = $("#RepairType").val();
var Program = $("#Program").val();
var camlQuery = new SP.CamlQuery();
var camlString = " <ViewFields>" +
"<FieldRef Name='ID' />" +
// "<FieldRef Name='Title' />" +
// "<FieldRef Name='Description' />" +
"<FieldRef Name='DamageType' />" +
"<FieldRef Name='ToolStatus' />" +
"<FieldRef Name='Components' />" +
"<FieldRef Name='RepairType' />" +
"<FieldRef Name='Program' />" +
"<Where>" +
"<And>" +
"<And>" +
"<Eq>" +
/* "<FieldRef Name='Title' />" +
"<Value Type='Text'>" + Title + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='DescriptionSelection' />" +
"<Value Type='Text'>" + DescriptionSelection + "</Value>" +
"</Eq>" +
"</And>" +
"<Eq>" +
*/
"<FieldRef Name='DamageType' />" +
"<Value Type='Text'>" + DamageType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='ToolStatus' />" +
"<Value Type='Text'>" + ToolStatus + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Components' />" +
"<Value Type='Text'>" + Components + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='RepairType' />" +
"<Value Type='Text'>" + RepairType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Program' />" +
"<Value Type='Text'>" + Program + "</Value>" +
"</Eq>" +
"</And>" +
"</Where>";
camlQuery.set_viewXml(camlString);
collListItem = oList.getItems(camlQuery);
clientContext.load(collListItem);
clientContext.executeQueryAsync(getListItemSucceeded, getListItemFailed);
});
$("#ToolStatusSelection").change(function () {
// var Title = $("#TitleSelection").val();
// var Description = $("#DescriptionSelection").val();
var DamageType = $("#DamageType").val();
var ToolStatus = $("#ToolStatus").val();
var Components = $("#Components").val();
var RepairType = $("#RepairType").val();
var Program = $("#Program").val();
var camlQuery = new SP.CamlQuery();
var camlString = " <ViewFields>" +
// "<FieldRef Name='ID' />" +
// "<FieldRef Name='Title' />" +
"<FieldRef Name='Description' />" +
"<FieldRef Name='DamageType' />" +
"<FieldRef Name='ToolStatus' />" +
"<FieldRef Name='Components' />" +
"<FieldRef Name='RepairType' />" +
"<FieldRef Name='Program' />" +
"<Where>" +
"<And>" +
"<And>" +
"<Eq>" +
/* "<FieldRef Name='Title' />" +
"<Value Type='Text'>" + Title + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='DescriptionSelection' />" +
"<Value Type='Text'>" + DescriptionSelection + "</Value>" +
"</Eq>" +
"</And>" +
"<Eq>" +
*/
"<FieldRef Name='DamageType' />" +
"<Value Type='Text'>" + DamageType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='ToolStatus' />" +
"<Value Type='Text'>" + ToolStatus + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Components' />" +
"<Value Type='Text'>" + Components + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='RepairType' />" +
"<Value Type='Text'>" + RepairType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Program' />" +
"<Value Type='Text'>" + Program + "</Value>" +
"</Eq>" +
"</And>" +
"</Where>";
camlQuery.set_viewXml(camlString);
collListItem = oList.getItems(camlQuery);
clientContext.load(collListItem);
clientContext.executeQueryAsync(getListItemSucceeded, getListItemFailed);
});
$("#ComponentSelection").change(function () {
// var Title = $("#TitleSelection").val();
// var Description = $("#DescriptionSelection").val();
var DamageType = $("#DamageType").val();
var ToolStatus = $("#ToolStatus").val();
var Components = $("#Components").val();
var RepairType = $("#RepairType").val();
var Program = $("#Program").val();
var camlQuery = new SP.CamlQuery();
var camlString = " <ViewFields>" +
"<FieldRef Name='ID' />" +
// "<FieldRef Name='Title' />" +
// "<FieldRef Name='Description' />" +
"<FieldRef Name='DamageType' />" +
"<FieldRef Name='ToolStatus' />" +
"<FieldRef Name='Components' />" +
"<FieldRef Name='RepairType' />" +
"<FieldRef Name='Program' />" +
"<Where>" +
"<And>" +
"<And>" +
"<Eq>" +
/* "<FieldRef Name='Title' />" +
"<Value Type='Text'>" + Title + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='DescriptionSelection' />" +
"<Value Type='Text'>" + DescriptionSelection + "</Value>" +
"</Eq>" +
"</And>" +
"<Eq>" +
*/
"<FieldRef Name='DamageType' />" +
"<Value Type='Text'>" + DamageType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='ToolStatus' />" +
"<Value Type='Text'>" + ToolStatus + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Components' />" +
"<Value Type='Text'>" + Components + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='RepairType' />" +
"<Value Type='Text'>" + RepairType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Program' />" +
"<Value Type='Text'>" + Program + "</Value>" +
"</Eq>" +
"</And>" +
"</Where>";
camlQuery.set_viewXml(camlString);
collListItem = oList.getItems(camlQuery);
clientContext.load(collListItem);
clientContext.executeQueryAsync(getListItemSucceeded, getListItemFailed);
});
$("#RepairTypeSelection").change(function () {
// var Title = $("#TitleSelection").val();
// var Description = $("#DescriptionSelection").val();
var DamageType = $("#DamageType").val();
var ToolStatus = $("#ToolStatus").val();
var Components = $("#Components").val();
var RepairType = $("#RepairType").val();
var Program = $("#Program").val();
var camlQuery = new SP.CamlQuery();
var camlString = " <ViewFields>" +
"<FieldRef Name='ID' />" +
// "<FieldRef Name='Title' />" +
// "<FieldRef Name='Description' />" +
"<FieldRef Name='DamageType' />" +
"<FieldRef Name='ToolStatus' />" +
"<FieldRef Name='Components' />" +
"<FieldRef Name='RepairType' />" +
"<FieldRef Name='Program' />" +
"<Where>" +
"<And>" +
"<And>" +
"<Eq>" +
/* "<FieldRef Name='Title' />" +
"<Value Type='Text'>" + Title + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='DescriptionSelection' />" +
"<Value Type='Text'>" + DescriptionSelection + "</Value>" +
"</Eq>" +
"</And>" +
"<Eq>" +
*/
"<FieldRef Name='DamageType' />" +
"<Value Type='Text'>" + DamageType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='ToolStatus' />" +
"<Value Type='Text'>" + ToolStatus + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Components' />" +
"<Value Type='Text'>" + Components + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='RepairType' />" +
"<Value Type='Text'>" + RepairType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Program' />" +
"<Value Type='Text'>" + Program + "</Value>" +
"</Eq>" +
"</And>" +
"</Where>";
camlQuery.set_viewXml(camlString);
collListItem = oList.getItems(camlQuery);
clientContext.load(collListItem);
clientContext.executeQueryAsync(getListItemSucceeded, getListItemFailed);
});
$("#ProgramSelection").change(function () {
// var Title = $("#TitleSelection").val();
// var Description = $("#DescriptionSelection").val();
var DamageType = $("#DamageType").val();
var ToolStatus = $("#ToolStatus").val();
var Components = $("#Components").val();
var RepairType = $("#RepairType").val();
var Program = $("#Program").val();
var camlQuery = new SP.CamlQuery();
var camlString = " <ViewFields>" +
"<FieldRef Name='ID' />" +
// "<FieldRef Name='Title' />" +
// "<FieldRef Name='Description' />" +
"<FieldRef Name='DamageType' />" +
"<FieldRef Name='ToolStatus' />" +
"<FieldRef Name='Components' />" +
"<FieldRef Name='RepairType' />" +
"<FieldRef Name='Program' />" +
"<Where>" +
"<And>" +
"<And>" +
"<Eq>" +
/* "<FieldRef Name='Title' />" +
"<Value Type='Text'>" + Title + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='DescriptionSelection' />" +
"<Value Type='Text'>" + DescriptionSelection + "</Value>" +
"</Eq>" +
"</And>" +
"<Eq>" +
*/
"<FieldRef Name='DamageType' />" +
"<Value Type='Text'>" + DamageType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='ToolStatus' />" +
"<Value Type='Text'>" + ToolStatus + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Components' />" +
"<Value Type='Text'>" + Components + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='RepairType' />" +
"<Value Type='Text'>" + RepairType + "</Value>" +
"</Eq>" +
"<Eq>" +
"<FieldRef Name='Program' />" +
"<Value Type='Text'>" + Program + "</Value>" +
"</Eq>" +
"</And>" +
"</Where>";
camlQuery.set_viewXml(camlString);
collListItem = oList.getItems(camlQuery);
clientContext.load(collListItem);
clientContext.executeQueryAsync(getListItemSucceeded, getListItemFailed);
});
});
function getAllListItemSucceeded(sender, args) {
var listItemEnumerator = collListItem.getEnumerator();
$("#tbody").empty();
while (listItemEnumerator.moveNext()) {
var oListItem = listItemEnumerator.get_current();
var ID = oListItem.get_item('ID');
// var Title = oListItem.get_item('Title');
// var Description = oListItem.get_item('DocumentSetDescription');
var DamageType = oListItem.get_item('Damage_x0020_Type');
var ToolStatus = oListItem.get_item('Tool_x0020_Status');
var Components = oListItem.get_item('Components');
var RepairType = oListItem.get_item('Repair_x0020_Type');
var Program = oListItem.get_item('Program');
// var optionTitle = $("<option value='" + Title + "'>" + Title + "</option>");
// var optionDescription = $("<option value='" + Description + "'>" + Description + "</option>");
var optionDamageType = $("<option value='" + DamageType + "'>" + DamageType + "</option>");
var optionToolStatus = $("<option value='" + ToolStatus + "'>" + ToolStatus + "</option>");
var optionComponents = $("<option value='" + Components + "'>" + Components + "</option>");
var optionRepairType = $("<option value='" + RepairType + "'>" + RepairType + "</option>");
var optionProgram = $("<option value='" + Program + "'>" + Program + "</option>");
var tr = $("<tr><td>" + '' + "</td><td>" + DamageType + "</td></tr>"+ ToolStatus + "</td></tr>"+ Components + "</td></tr>"+ RepairType + "</td></tr>"+ Program + "</td></tr>");
// $("#TitleSelection").append(optionTitle);
// $("#DescriptionSelection").append(optionDescription);
$("#DamageType").append(optionDamageType);
$("#ToolStatusSelection").append(optionToolStatus);
$("#ComponentSelection").append(optionComponents);
$("#RepairTypeSelection").append(optionRepairType);
$("#ProgramSelection").append(optionProgram);
$("#tbody").append(tr);
}
}
function getAllListItemFailed(sender, args) {
alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
function getListItemSucceeded(sender, args) {
var listItemEnumerator = collListItem.getEnumerator();
$("#tbody").empty();
while (listItemEnumerator.moveNext()) {
var oListItem = listItemEnumerator.get_current();
var ID = oListItem.get_item('ID');
// var Title = oListItem.get_item('Title');
// var Description = oListItem.get_item('DocumentSetDescription');
var DamageType = oListItem.get_item('Damage_x0020_Type');
var ToolStatus = oListItem.get_item('Tool_x0020_Status');
var Components = oListItem.get_item('Components');
var RepairType = oListItem.get_item('Repair_x0020_Type');
var Program = oListItem.get_item('Program');
var tr = $("<tr><td>" + ID + "</td><td>" + DamageType + "</td></tr>"+ ToolStatus + "</td></tr>"+ Components + "</td></tr>"+ RepairType + "</td></tr>"+ Program + "</td></tr>");
$("#tbody").append(tr);
}
}
function getListItemFailed(sender, args) {
alert('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
</script>
推荐答案
以下示例供您参考:
1.创建自定义列表分析工具".
1. Create a custom list "Analysis Tools".
2.添加五个单行的文本列"DamageType"，"ToolStatus"，"Components"，"RepairType".和程序".
2. Add five single line of text columns "DamageType","ToolStatus","Components","RepairType" and "Program".
3.将以下代码添加到Web部件页面的Content Editor Web部件中.
3. Add the following code into a Content Editor Web Part in web part page.
<div>
<table id="myTable">
<tr>
<th style="padding-right:20px"> </th>
<th style="padding-right:20px">DamageType</th>
<th style="padding-right:20px">Tool Status</th>
<th style="padding-right:20px">Components</th>
<th style="padding-right:20px">Repair Type</th>
<th style="padding-right:20px">Program</th>
</tr>
<tr>
<td></td>
<td>
<select id="DamageType">
<option></option>
</select>
</td>
<td>
<select id="ToolStatusSelection">
<option></option>
</select>
</td>
<td>
<select id="ComponentSelection">
<option></option>
</select>
</td>
<td>
<select id="RepairTypeSelection">
<option></option>
</select>
</td>
<td>
<select id="ProgramSelection">
<option></option>
</select>
</td>
</tr>
<tbody id="tbody">
</tbody>
</table>
</div>
<script src="http://code.jquery.com/jquery-1.10.2.min.js" type="text/javascript"></script>
<script type="text/javascript">
(function(){ GetAllListItems();
(function () { GetAllListItems();
(#DamageType").change(function(){ FilterListItems(); });
("#DamageType").change(function(){ FilterListItems(); });
这篇关于如何显示查找列以显示正确的字符串?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
