I do not understand a lot of Shield UI. Documentation is very vague to me. What I'd like to do is have the table that is produced with the code below to become editable. I've tried about everything and feel I am close but no avail. Could someone please guide me? Also, I've taken several looks at their documentation as well.
<script type="text/javascript">
$(function() {
$(document).ready(function()) {
$("#grid").shieldGrid({
dataSource: {
remote: {
read: g,
modify: {
url: "xml/smt-schedule.xml"
},
},
/*End remote */
schema: {
type: "xml",
data: "ss_schedule",
fields: {
Id: {
path: "ss_id._text"
},
Part_Num: {
path: "ss_part_num._text"
},
ROHS: {
path: "ss_rohs._text"
},
Wave_SS: {
path: "ss_wave_ss._text"
},
WO: {
path: "ss_wo._text"
},
Quantity: {
path: "ss_qty._text"
},
Duration: {
path: "ss_duration._text"
},
Start_Date: {
path: "ss_wo_start._text"
},
Total_Time: {
path: "ss_total_time._text"
},
Days: {
path: "ss_est_days._text"
},
Run_Date: {
path: "ss_est_run_date._text"
},
Pulled: {
path: "ss_pulled._text"
},
Prep: {
path: "ss_prep._text"
},
SMT: {
path: "ss_smt._text"
},
Notes: {
path: "ss_notes._text"
}
},
},
/* Line 48 Schema */
},
/*Begin Code for paging */
paging: {
pageSize: 30,
pageLinksCount: 10,
messages: {
infoBarTemplate: "From {0} to {1} items of a total of {2}",
firstTooltip: "First page",
previousTooltip: "Previous page",
nextTooltip: "Next page",
lastTooltip: "Last page"
}
},
/*End of paging start line 75*/
/*End Code for paging */
rowHover: false,
columns: [{
field: "Id",
width: "20px",
editable: false
}, {
field: "Part_Num",
width: "100px",
editable: true
}, {
field: "ROHS",
width: "80px",
editable: true
}, {
field: "Wave_SS",
title: "Wave/SS",
width: "80px"
}, {
field: "WO",
width: "60px",
editable: true
}, {
field: "Quantity",
width: "80px",
editable: true
}, {
field: "Duration",
width: "80px",
editable: true
}, {
field: "Start_Date",
title: "Start Date",
width: "80px",
type: Date,
editable: true
}, {
field: "Total_Time",
title: "Total Time",
width: "80px",
editable: true
}, {
field: "Run_Date",
title: "Run Date",
width: "80px",
type: Date,
editable: true
}, {
field: "Pulled",
width: "50px",
editable: true
}, {
field: "Prep",
width: "50px",
editable: true
}, {
field: "SMT",
width: "50px",
editable: true
}, {
field: "Notes",
width: "80px",
editable: true
}, {
width: 80,
title: " ",
buttons: [{
commandName: "edit",
caption: "Edit"
}, {
commandName: "delete",
caption: "Delete"
}]
}
],
editing: {
enabled: true,
Event: "doubleclick",
type: "row",
mode: "inline",
confirmation: {
"delete": {
enabled: true,
template: function(item) {
return "Delete work order '" + item.WO + "'?";
}
}
}
},
/*--End toolbar--*/
toolbar: [{
buttons: [{
commandName: "pdf",
caption: '<span class="sui-sprite sui-grid-icon-export-pdf"></span> <span class="sui-grid-button-text">Export to PDF</span>'
}]
}],
exportOptions: {
proxy: "/filesaver/save",
pdf: {
fileName: "smt-schedule-report.pdf",
author: "Dynalab, Inc.",
size: "a4",
orientation: "landscape",
fontSize: 10,
margins: {
left: 40
}
} /*End pdf */
},
/*End expportOptions */
toolbar: [{
buttons: [{
commandName: "insert",
caption: "Add Record"
}],
position: "top"
}]
});
/* Begin search by typing */
var dataSource = $("#grid").swidget().dataSource,
input = $("#filterbox input"),
timeout,
value;
input.on("keydown", function() {
clearTimeout(timeout);
timeout = setTimeout(function() {
value = input.val();
if (value) {
dataSource.filter = {
or: [{
path: "Part_Num",
filter: "contains",
value: value
}, {
path: "WO",
filter: "contains",
value: value
}
]
};
} else {
dataSource.filter = null;
}
dataSource.read();
}, 300);
/*End search by typing */
});
}
}); /*End document.ready */
</script>
