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');
Related
I have a gridview which has some templatefield. At cell5 i have a label which is the input for database. but not all the labels in all the rows contains the value. its based on the click event of an editTemplateField. I have vb.net code for accessing that label inside the gridview. but i want to get it by javascript. following is the sample vb.net code and javascript that i have tried so far.
For Each i as gridViewRow in gridview.Rows
Dim lnk as linkbutton = CType(i.FindControl("del"),LinkButton)
If lnk.ForeColor = Drawing.Color.Red
pid = CType(gridview.Rows(i).FindControl("lblposid"), Label).Text
End If
Next
javascript:
for (var i = 0; i < grid.rows.length-1; i++) {
if(grid.rows[i].cells[1].style.color == "red")
pid = grid.rows[i].cells[5].innerHTML;
}
vb.net works . but javascript is not working. i dont know how to make it in javascript.Thanks in advance]
Note: The template field's visible is "False" also.
I found my own solution now.
for (var i = 1; i < grid.rows.length; i++)
{
var links = grid.rows[i].getElementsByTagName("a");
if(links[1].style.color=="red")
{
var spanlist = grid.rows[i].getElementsByTagName("span");
pid=spanlist[1].innerHTML;
links[1].style.color="blue";
}
}
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();
I have a extended datatable, RICHFACES 3.3.3 with sorting and filtering enabled. The table is rendered dynamically. Based on the requirement, I need to disable certain rows(which contain editable fields) when the table is displayed.
I have that logic written in a Javascript function rowBlur(), and call it whenever the page is displayed. Hence, when the table is loaded the required rows are disabled as expected. The problem is whenever I filter/sort the table, the disabled rows get enabled again.
Is there any way I can call the javascript function whenever filter or sort happens?
Here is the code:
HtmlExtendedDataTable dynamicDataTable = new HtmlExtendedDataTable();
dynamicDataTable.setOnkeydown("filterAllOnEnter(event)");
function filterAllOnEnter(event) {
if(event.keyCode == 13) {
jQuery(".rich-filter-input").blur();
rowblur();
return false;
} else
return true;
}
// js code////////////
<script>
function show(){
val = '${myController.mergeWorkMap}';
}
</script>
<script>
function rowblur(){
for(var i=0;i<7;i++){
var firstCol = "myForm:dynamicTable:"+i+":col0" ;
var secondCol = "myForm:dynamicTable:"+i+":col1" ;
var merge =document.getElementById(firstCol).textContent;
var work =document.getElementById(secondCol).textContent;
var obj = JSON.parse(val).mergeWorkMap;
if(!(work == obj[merge])){
var col3 = "myForm:dynamicTable:" + i + ":col3";
var col4 = "myForm:dynamicTable:" + i + ":col4";
var col5 = "myForm:dynamicTable:" + i + ":col5";
var col6 = "myForm:dynamicTable:" + i + ":col6";
document.getElementById(col3).disabled = true;
document.getElementById(col4).disabled = true;
document.getElementById(col5).disabled = true;
document.getElementById(col6).disabled = true;
}
}
}
</script>
The rowblur() won't work properly on filtering, and on sorting the columns it won't work at all.
I'm writing a custom javascript validation script whereby i iterate through all input elements in a div named 'toggle' and select each that has a class named 'required' and if the value of the element is an empty string (empty) then i need to create labels containing the error message and place them right next to the textbox.
Here's the code:
function clientErrMsgs() {
var container = document.getElementById("toggle");
var inputArray = container.getElementsByTagName("input");
for (var i = 0; i < inputArray.length; i++) {
alert("");
if (inputArray[i].getAttribute("class") == "required" && inputArray[i].value == "") {
var errmsg = inputArray[i].getAttribute("data-errormessage");
var labelErr = document.CreateElement('label');
labelErr.id = "ErrMsg" + i;
labelErr.value = errmsg;
var parent = inputArray[i].parentNode;
parent.appendChild(labelErr);
}
}
}
the program executes well (tested it with alert()) up until the following line:
var labelErr = document.CreateElement('label');
Where is the problem?
you can use asp.net custom validator to do this
i am giving you an example, how to do this....
<asp:CustomValidator ID="CustomValidator1" runat="server"
ErrorMessage="Sms length is exceeding over 160."
ClientValidationFunction="validateLength" ControlToValidate="txtSmsMessage"
SetFocusOnError="True" ValidationGroup="add">*</asp:CustomValidator>
<script language="javascript" type="text/javascript">
function validateLength(oSrc, args)
{
args.IsValid = (args.Value.length < 160);
}
</script>
i suggest please try this...
I got things working with:
http://jsfiddle.net/ahallicks/kxPeN/2/
labels don't have a value attribute
Its document.createElement not document.CreateElement
MDC link : document.createElement
Update: you should access the innerHTML of the label and not the value
The snippet
var labelErr = document.createElement('label');
labelErr.id = "ErrMsg" + i;
labelErr.innerHTML= errmsg;
var parent = inputArray[i].parentNode;
parent.appendChild(labelErr);
This is not a direct answer to your question, but would your superior go for a different pre-built validation method? I'm partial to FlowPlayers jQuery based validator. Very simple to setup:
$("#myform").validator();
I've written several validation frameworks in the past. I finally got tired of reinventing the wheel.
May I suggest this:
function clientErrMsgs() {
var container = document.getElementById("toggle");
var inputArray = container.getElementsByTagName("input");
for (var inp, i=0, n=inputArray.length; i<n; i++) {
inp = inputArray[i];
if (inp.getAttribute("class") === "required") {
var errMsg = container.getElementById("ErrMsg"+i);
if (!errMsg) {
errMsg = document.createElement('span');
errMsg.id = "ErrMsg" + i;
errMsg.innerHTML= inp.getAttribute("data-errormessage");
inp.parentNode.appendChild(errMsg);
}
errMsg.style.display= (inp.value === "")?"":"none"
}
}
}
There are two things I would like help with please. I need help accessing the currently edited existing row in the Radgrid, as as well as the index of the Edit form when trying to add a new record to the table/
function OnClientSelectedIndexChanged(sender, eventArgs) {
var item = eventArgs.get_item();
// alert(item.get_value());
grid = $find("<%= rgSecurity.ClientID %>");
var MasterTable = grid.get_masterTableView();
var selectedRows = MasterTable.get_selectedItems();
// alert("about to get to grid");
alert(selectedRows.length);
if (selectedRows.length > 1) {
for (var i = 0; i < selectedRows.length; i++) {
var row = selectedRows[i];
alert(row);
inputField = MasterTable.getCellByColumnUniqueName(row, "Item")
alert(inputField);
if (inputField) {
inputFieldValue = inputField.value
break;
}
}
}
else
{
// alert(inputField);
}
window.radopen('<%=PopLink %>?sel=' + item.get_value() + "&avail=" + inputFieldValue, "UserRoleDialog");
return false;
}
The currently edited grid row can be retrieved on the server using the EditItems[0] collection of the master table or through the e.Item argument inside the EditCommand server event handler. The index of the edited row can be fetched from the ItemIndex property of the item referenced as explained in the first sentence.