Get edit item value in RadGrid client-side - javascript

i'm looking for somone that can help me on this problem:
i've a Telerik RadGrid in edit-mode, after pressing radgrid's update button i do some checks into a javascript file; i want to check the value in some cells that are in edit mode but i don't know how to see the value.
I try to explain better with an example: i have some columns editable and some read-only, for the read-only columns i can view the value but for the editable columns i view all the html of the cell and i don't know how to get only the value, here is the code
function calculate(dgRDO) {
var grid = $find(dgRDO).get_masterTableView();
var righe = grid.get_editItems();
for (var i = 0; i < righe.length; i++) {
var row = righe[i];
//i can view this value, CODART column is ReadOnly
var codart = grid.getCellByColumnUniqueName(row, "CODART").innerHTML;
//i cannot view only the value but i view the entire html of the cell, PREZZO column is editable
var prezzo = grid.getCellByColumnUniqueName(row, "PREZZO").innerHTML;
}
Thanks for any suggestion

RESPONSE FROM TELERIK (IT WORKS)
In order to easily access RadGrid cells client-side you could use the ClientDataKeyNames property. It should contain the DataField names of the columns that will be accessed on the client. Illustration on extracting key values client-side is available in this article.
A sample function for accessing a column that is added to the ClientDataKeyNames collection would look similar to this:
function command(sender, eventArgs) {
var grid = $find("<%= RadGrid1.ClientID %>");
var masterTableView = grid.get_masterTableView();
var editItem = masterTableView.get_editItems()[0];
var cellValue = editItem.getDataKeyValue("Quantity");
}

Try this
var prezzo = grid.getCellByColumnUniqueName(row, "PREZZO").val();

Related

Append a New Table Row (1 Row 2 Columns) on Google Apps Script

I'm trying to make an automation script that updates an existing Google Docs based on user responses from Google Form. so there are 3 questions (Name, University Number Identification or NIM in Bahasa, and Department or bidang), the department question used for categorizing each respondent.
So the goal is whenever a form is submitted, then the Docs is updated too. So I want to make the update make a new row with a cell that contains a template string that I already used in my script on the spreadsheets. But the problem is it only appends a single column for each row, however, that's not what I intended to have happened. I want it to update 1 row and 2 columns.
Screenshot Of the Google Form
Screenshot of the Google Docs Error
Screenshot of what I intended the Google Docs when it's updated to be
function appendTable(variabel){
var rangePSDI = body.findText(variabel);
var searchElement = body.findElement(DocumentApp.ElementType.TABLE, rangePSDI);
element = searchElement.getElement();
table = element.asTable();
table.appendTableRow().appendTableCell(variabel);
}
if (bidang == 'PSDI') {
body.replaceText('{{NamaPSDI}}', nama);
body.replaceText('{{NIMPSDI}}', nim);
appendTable("{{NamaPSDI}}");
appendTable("{{NIMPSDI}}");
return;
} else if (bidang == 'PSDM') {
body.replaceText('{{NamaPSDM}}', nama);
body.replaceText('{{NIMPSDM}}', nim);
appendTable("{{NamaPSDM}}");
appendTable("{{NIMPSDM}}");
return;
}
Think of the appendTableRow as <tr> in HTML where you have to set the cell using <td>or appendTableCell.
See Table Row element in HTML.
Try this:
Code:
function appendTable(){
var doc = DocumentApp.openById('someid');
var body = doc.getBody();
var tables = body.getTables();
var text = "PSDM";
tables.forEach(table => {
if(table.getCell(0,0).getText() == text){
table.replaceText("{{Nama"+text+"}}", "test nama"+text)
table.replaceText("{{NIM"+text+"}}", "test NIM"+text)
var tr = table.appendTableRow();
tr.appendTableCell("{{Nama"+text+"}}");
tr.appendTableCell("{{NIM"+text+"}}");
}
})
}
Before:
After:
PSDI
PSDM

System.Web.HttpException: 'Cannot have multiple items selected in a DropDownList

I realise that this question has been asked in various forms a number of times, but I have not found a solution that solves my issue.
I am writing a web site to record details of dead people. My web page has a title drop down box and a sex drop down box.
In the database, these are linked and I need to set the sex based on the title.
I have a list box that contains the title id / sex id link and a function to look up the sex from the title using this list box.
<asp:Label CssClass="LegacyLabel">Title</asp:Label>
<asp:ListBox ID="TitleSex" runat="server" CssClass="hidethis" SelectionMode="Single"></asp:ListBox>
<asp:DropDownList ID="LegatorTitle" runat="server" CssClass="LegacyDDL" TabIndex="2" onchange="setSex()"></asp:DropDownList>
<asp:Label CssClass="LegacyLabel">Sex</asp:Label>
<asp:DropDownList ID="LegatorSex" runat="server" CssClass="LegacyDDL" TabIndex="5"></asp:DropDownList>
<script>
function setSex() {
var t = document.getelementbyid("<%=LegatorTitle.ClientID %>");
var ts = document.getElementById("<%=TitleSex.ClientID %>");
var s = document.getElementById("<%=LegatorSex.ClientID %>");
//get title selectd value
var tValue = t.options[t.selectedIndex].value;
var opts = ts.options;
//set the title sex selected value
ts.selectedItem.selected = false;
for (var z0 = 0; z0 < opts.length; z0++) {
if (opts[z0].value == tValue) {
ts.selectedIndex = z0;
break;
}
}
//get the title sex selected text
var tsText = ts.options[ts.selectedIndex].text;
opts = s.options;
//set the sex selected value
s.selectedItem.selected = false;
for (z0 = 0; z0 < opts.length; z0++) {
if (opts[z0].value == tsText) {
s.selectedIndex = z0;
break;
}
}
}
</script>
The drop down lists and list box are set from a web service using datatables
dataTable = fcws.GetTitles(UNAME, PWORD)
LegatorTitle.Items.Clear()
LegatorTitle.DataSource = dataTable
LegatorTitle.DataTextField = "TitleName"
LegatorTitle.DataValueField = "TitleId"
LegatorTitle.DataBind()
TitleSex.Items.Clear()
TitleSex.DataSource = dataTable
TitleSex.DataTextField = "SexId"
TitleSex.DataValueField = "TitleId"
TitleSex.DataBind()
dataTable = fcws.GetTitles(UNAME, PWORD)
LegatorTitle.Items.Clear()
LegatorTitle.DataSource = dataTable
LegatorTitle.DataTextField = "TitleName"
LegatorTitle.DataValueField = "TitleId"
LegatorTitle.DataBind()
'sex
dataTable = fcws.GetSexes(UNAME, PWORD)
LegatorSex.Items.Clear()
LegatorSex.DataSource = dataTable
LegatorSex.DataTextField = "SexName"
LegatorSex.DataValueField = "SexId"
LegatorSex.DataBind()
I also have case opened and case closed dates and a status (drop down list with Open and Close options)
When I try to load an open case, everything works perfectly
When I try to load a closed case, I get the following error
Server Error in '/' Application
Cannot have multiple items selected in a DropDownList
Source error
Line 245: var t = document.getelementbyid("<%=LegatorTitle.ClientID %>");
Line 246: var ts = document.getElementById("<%=TitleSex.ClientID %>");
--> Line 247: var s = document.getElementById("<%=LegatorSex.ClientID %>"); <---
Line 248: //get title selected value
Line 249: var tValue = t.options[t.selectedIndex].value;
(--> ... <-- is highlighted line)
I cannot post images yet so here is a link to the error
What I don't understand is: -
why the error occurs in the first place
why the error is only occurring for closed cases
why, when I change the line
'var s = document.getElementById("<%=LegatorSex.ClientID %>");' to 'var s = document.getElementById("LegatorSex");', the error moves to the line var ts = document.getElementById("<%=TitleSex.ClientID %>");
(if I change all the lines in the above code, the error moves to the previous line with <%=xxx.ClientID %>)
I have checked responses that were helpful (that is why I clear the lists before binding to them and why I set the selectedItem.selected to false before re-setting it) to the downright unhelpful (The error is pretty specific: You can't have multiple selections in a drop down list. Find another control which fits your needs better!) but nothing seems to work.
I have found the answer
(and I feel a bit stupid that I didn't spot this before...)
As part of the job, I had to default the case status to open for new cases. The code I added to set the case status to open was being run for all cases, not just new ones.
Open cases worked fine because the selection was already set to "open"
Many thanks for your input and very sorry for wasting your time over my stupidity
I still have no idea why the error reports the failing line as one with
'getelementbyid("<%=xxx.ClientID %>");'

How to get complete data from (html) bootstrap table when pagination is turned on

I am using bootstrap table in my web page and want to get complete textual data from all table cells, when pagination is on. I have tried the following method and it returns all the data:
var data = $('#' + tableID).bootstrapTable('getData')
Now when i traverse data object to get value for every cell it works fine but, for those cells which have some nested html , for example:
<td class="danger">cell 4</td>
<td>
google
</td>
Now, in this case, i want to get value for second cell as google but it returns me whole html as
google
Any idea, how i can get only textual value.
I can't do any server side operation, I have to achieve this using javascript/jquery. I have also tried using jquery:
function getColData(tableID,colIndex) {
var colArray = $('#' + tableID + ' td:nth-child'+'('+colIndex+')').map(function(){
return $(this).text();
}).get();
return colArray
}
it returns data correctly but only which is visible on active page and i want all the data.
Based on your file on JSFiddle I have modified the JS part as follows, this will get you the text on every td(i.e. text or text content) and not the values of their attributes. Basically this traverses through the DOM searching for tags embedded in ones - except for those on the table header - then obtains the text value.
var table = $('#table'), button = $('#button');
button.click(function() {
var data = [];
table.find('tr:not(:first)').each(function(i, row) {
var cols = [];
$(this).find('td').each(function(i, col) {
cols.push($(this).text());
});
data.push(cols);
});
alert(data);
});
You can see it in action here
UPDATE:
This will get you all data regardless of pagination, also it will strip tags and nested tags.
var table = $('#table'), button = $('#button');
button.click(function() {
var messedData = table.bootstrapTable('getData');
var data = [];
$.each(messedData, function(i, row) {
var rowData = {
'name': row['0'],
'star': row['1'],
'forks': row['2'],
'desc': row['3'],
}
for (prop in rowData) {
var tmp = document.createElement("div");
tmp.innerHTML = rowData[prop];
rowData[prop] = tmp.textContent || tmp.innerText || "";
}
data.push(rowData);
});
console.log(data);
});
You can see it here
Since the actual data is coming in as a string, I don't think bootstrap-table can't differentiate it from the other data. The simple solution I can think of is to use substring() to extract the data from the cells that contain custom html.
http://jsfiddle.net/vwg5Lefz/
The alternative is to go through the generated table <td> and use text() to get the text data from the cells.
http://jsfiddle.net/n0djy60v/

SharePoint List, display calculated field in edit form

I have several SharePoint lists that have a calculated field, which is calculated from the ID field, e.g. if the ID is 13, the calculated field is "XX00013", where "XX" indicates the purpose of this particular list.
By default, in the Display From, this "XX00013" is shown.
How can I make it shown as read-only in the Edit Form too? So that the user who is editing the entry always can see which entry s/he is editing?
I don't think I can edit the EditForm, as it's restricted by the webmaster.
I do have access to Content Editor Web Part to edit some javascript code.
Any suggestions?
I tried to put following code in the in the Content Editor Web Part, which is added to the Edit page. It works so far that the "XX00013" is shown as ready-only in the Edit form. This solution is just a walk-around.
Still the question of in general how to show calculated field remains.
<script type="text/javascript">
function DisplayID(){
var regex = new RegExp("[\\?&]"+"ID"+"=([^&#]*)");
var qs = regex.exec(window.location.href);
var sID = qs[1];
var stID="XX";
var nLength=5-sID.length;
var i=0;
do{
stID=stID.concat("0");
i++;
}while (i<nLength)
stID=stID.concat(sID);
var TD1 = document.createElement("TD");
TD1.className = "ms-formlabel";
TD1.innerHTML = "<h3 class='ms-standardheader'>XX_ID</h3>";
var TD2 = document.createElement("TD");
TD2.className = "ms-formbody";
TD2.innerHTML = stID;
var IdRow = document.createElement("TR");
IdRow.appendChild(TD1);
IdRow.appendChild(TD2);
var ItemBody = GetSelectedElement(document.getElementById("idAttachmentsRow"),"TABLE").getElementsByTagName("TBODY")[0];
ItemBody.insertBefore(IdRow,ItemBody.firstChild);
}
_spBodyOnLoadFunctionNames.push("DisplayID");
</script>

Gridview Footer row textbox in JavaScript

I have been accessing the rows of Gridview quite easily using javascript.
But when I try to add a new row and then try to access, then the code is not working.
Is there a way by which I can access the footer row text box?
Below is my code which works well when edit mode text boxes are to be accessed. Please donot post any link.
function OnSelectIndexChange() {
var drpdwn = document.getElementById("ddlSelectUnderwriterCond");
var drpdwnValue = drpdwn.options[drpdwn.selectedIndex].text;
var gridview = document.getElementById("<%= StandardUndewritingGrid.ClientID %>");
for (var i = 1; i <= gridview.rows.length; i++) {
var labels = gridview.rows[i].cells[0].getElementsByTagName("input")[0].value;
var txtbx = gridview.rows[i].cells[0].children[0];
if (drpdwnValue != '-- Select --')
txtbx.value = labels + '<^>' + drpdwnValue + '<^>';
}
}
I have just figured out a way of accessing the footer row and code is working fine so I am posting as it might help someone as well:
var flabels = document.getElementById('<%=((TextBox)gridname.FooterRow.FindControl("controlname")).ClientID %>');
if (flabels != null) {
}
It works by simple logic:
var grid = document.getElementById('<%= GridviewName.ClientID %>');
var FooterTextBoxName = grid.getElementsbyTagName('FooterTextBoxName');

Categories