get value of dynamiclly created radiobuttonlist - asp.net

I'm trying to get the value of a dynamically created radiobuttonlist via javascript to call a pagemethod.
This is how I'm creating the rbl:
rbl.Attributes["onclick"] = "javascript:preview('" + rbl.ID + "','" + rbl.ClientID + "');";
And this is the javascript:
function preview(controlid, clientid)
{
var radio = document.getElementsByName(clientid);
var answer = "k";
for (var ii = 0; ii < radio.length; ii++)
{
if (radio[ii].checked)
answer = radio[ii].value;
}
PageMethods.SaveAnswer(controlid, answer);
}
The problem however is that I want to get the groupname of the radiobuttionlist so I can use getElementsByName, but i have no luck so far.
Kind regards,
Mark

Ah well I got a temporary solution for now just to continue..
<script type="text/javascript" language="javascript">
function SaveAnswer(ctrlid)
{
var answer;
var radio = document.getElementsByName('ctl00$cphContent$' + ctrlid);
for (var ii = 0; ii < radio.length; ii++)
{
if (radio[ii].checked)
answer = radio[ii].value;
}
PageMethods.SaveAnswer(ctrlid, answer);
}
function onComplete(res)
{
//alert(res);
}
</script>
As you can see, I added ctrl00$cphContent$ by hand.

Related

How do scrape table from the provided website using casperjs?

The final goal is to retrieve stock data in table form from provided broker website and save it to some text file. Here is the code, that I managed to compile so far by reading few tutorials:
var casper = require("casper").create();
var url = 'https://iqoption.com/en/historical-financial-quotes?active_id=1&tz_offset=60&date=2016-12-19-21-59';
var terminate = function() {
this.echo("Exiting ...").exit();
};
var processPage = function() {
var rows = document.querySelectorAll('#mCSB_3_container > table'); //get table from broker site (copy/paste via copy selector in chrome tools)
//var nodes = document.getElementsByClassName('mCSB_container');
this.echo(rows);
this.echo(rows.length);
for (var i = 0; i < rows.length; i++)
{
var cell = rows[i].querySelector('.quotes-table-result__date');
this.echo(cell); //print each cell
}
};
casper.start(url);
casper.waitForSelector('#mCSB_3_container', processPage, terminate);
casper.run();
This code should retrieve the stock price table and print out each cell. However, all what I get is 'undefined', which likely means that I got no objects returned by queryselector call. And please assume that I don't know any web programming (HTML,CSS).
First of all, on problem is that the waitFor wasn't set so good, you have to wait for the rows/cells.
The Nodes you get out on this page are a bit wired,if anybody got a more abstract solution where ChildNodes are better handled that in my solution i would be really interested:
var casper = require('casper').create();
var url = 'https://eu.iqoption.com/en/historical-financial-quotes?active_id=1&tz_offset=60&date=2016-12-19-21-59';
var length;
casper.start(url);
casper.then(function() {
this.waitForSelector('#mCSB_3_container table tbody tr');
});
function getCellContent(row, cell) {
cellText = casper.evaluate(function(row, cell) {
return document.querySelectorAll('table tbody tr')[row].childNodes[cell].innerText.trim();
}, row, cell);
return cellText;
}
casper.then(function() {
var rows = casper.evaluate(function() {
return document.querySelectorAll('table tbody tr');
});
length = rows.length;
this.echo("table length: " + length);
});
// This part can be done nicer, but it's the way it should work ...
casper.then(function() {
for (var i = 0; i < length; i++) {
this.echo("Date: " + getCellContent(i, 0));
this.echo("Bid: " + getCellContent(i, 1));
this.echo("Ask: " + getCellContent(i, 2));
this.echo("Quotes: " + getCellContent(i, 3));
}
});
casper.run();

Write custom plugins/extensions like kendoui and telerik for asp.net mvc razor

Telerik and kendoUI offers a number of html controls like grids, charts etc. to enhance the ui in asp.net mvc. More interesting thing is they are used as html extensions and hence we can bind some model to the controls which also makes it somewhat strongly typed. It also uses javascript libs to handle client side interactions. I need to get some gist over how can we write custom plugins like kendo and telerik like building my own grid component. What is the proper pattern that i should follow?
This is not good example but i think it is good start.
This method generates dataTable
public static string GenerateTableHtml<TValue>(IEnumerable<TValue> model, string DeleteUrl, string EditUrl)
{
StringBuilder Table = new StringBuilder();
Table.AppendLine("<script type='text/javascript'> $(document).ready(function () {"
+ "$('.btnDelete').click(function () {"
+ "var url = $(this).attr('dropzone');"
+ "$('#dialog-form').attr('action', url);})"
+ "})</script>");
Table.AppendLine(" <div class=\"dataTables_wrapper\"><div class=\"\">");
string TableButtonsTemplate = "<td><div class=\"table_buttons\">"
+ "<img src=\"../Images/icons/dark/pencil.png\")\" title=\"რედაქტირება\" />"
+ "<a href=\"#\" id=\"opener\" class=\"btnDelete\" dropzone=\"{1}\">"
+"<img class=\"\" src=\"../Images/icons/dark/close.png\")\" title=\"წაშლა\" /></a>"
+ "</div></td>";
string TableButtons = String.Empty;
bool HaveActionButtons = false;
string rowID = string.Empty;
if (String.IsNullOrEmpty(DeleteUrl) == false || string.IsNullOrEmpty(EditUrl) == false)
{
HaveActionButtons = true;
}
Table.AppendLine("<table class=\"display dTable\" cellspacing=\"0\" cellpadding=\"0\" border=\"0\">");
Table.AppendLine("<thead>");
Table.AppendLine("<tr>");
int ColumnIndex = 0;
int rowIndexer = 0;
var fType = model.GetType().FullName;
var startIndex = fType.IndexOf("[[") + 2;
var type = fType.Substring(startIndex, fType.Length - startIndex - 2);
foreach (var item in model)
{
if (ColumnIndex == 0)
{
var properties = item.GetType().GetProperties();
foreach (var prop in properties)
{
var metaData = ModelMetadataProviders.Current.GetMetadataForProperty(null,
Type.GetType(type), prop.Name);
if (metaData.DisplayName != null)
{
Table.AppendLine("<th class=\"ui-state-default\" rowspan=\"1\" colspan=\"1\">" + metaData.DisplayName + "</th>");
}
else
{
Table.AppendLine("<th class=\"ui-state-default\" rowspan=\"1\" colspan=\"1\">" + prop.Name + "</th>");
}
}
Table.AppendLine("<th></th>");
Table.AppendLine("</tr>");
Table.AppendLine("</thead>");
Table.AppendLine("<tbody>");
}
foreach (var value in item.GetType().GetProperties().Select(x => x.GetValue(item, null)))
{
int rowCount = item.GetType().GetProperties().Select(x => x.GetValue(item, null)).Count();
rowIndexer++;
if (rowIndexer != rowCount)
{
if (rowIndexer == 1)
{
Table.AppendLine("<tr class=\"gradeA odd\">");
}
if (value != null)
{
string val = value.ToString();
Table.AppendLine("<td>" + val + "</td>");
rowID = item.GetType().GetProperty("ID").GetValue(item, null).ToString();
}
else
{
Table.AppendLine("<td></td>");
}
}
else
{
if (value != null)
{
Table.AppendLine("<td>" + value.ToString() + "</td>");
}
else
{
Table.AppendLine("<td></td>");
}
if (HaveActionButtons == true)
{
Table.AppendLine(String.Format(TableButtonsTemplate, EditUrl + rowID, DeleteUrl + rowID));
}
Table.AppendLine("</tr>");
if (rowIndexer != item.GetType().GetProperties().Count())
{
Table.AppendLine("<tr class=\"gradeA odd\">");
}
}
}
rowIndexer = 0;
ColumnIndex++;
}
Table.AppendLine("</tbody></table></div></div>");
Table.AppendLine(String.Format(Resources.MainResources.ModalDialogConfirm, "Confirmation",
"<strong>Warning!</strong><br /> Are you sure you want to delete user?", ""));
return Table.ToString();
}

runtime generated Checkbox validation

I have panel in the asp.net webpage, and i m generating the checkbox at runtime..
i want to validate checkbox, required field validator when form submit.
here is my code:
cv = new CustomValidator();
cv.ID = "cv" + "_" + dt.Rows[0]["RefQueID"].ToString();
cv.ValidationGroup = "grp";
cv.Display = ValidatorDisplay.None;
cv.ErrorMessage = "- Question " + intQuestionNo.ToString();
cv.ClientValidationFunction = "chkCount";
cv.Attributes.Add("rfvid", cv.ID.ToString());
//this portion of code is for custom validation javascript function
StringBuilder sb = new StringBuilder();
sb.Append("<script type='text/javascript'> function chkCount(sender,args) { ");
sb.Append(" args.IsValid = GetChk(document.getElementById('ctl00_ContentPlaceHolder1_" + cbl.ID.ToString() + "'))");
sb.Append(" } </script>");
Page page = HttpContext.Current.Handler as Page;
page.RegisterStartupScript("_Check", sb.ToString());
and in my javascript function i return this:
function GetChk(chkbox, args) {
if (!isConfirmed) {
alert('hi');
var chkBoxList = document.getElementById(chkbox.ClientID);
var chkBoxCount = chkBoxList.getElementsByTagName("input");
for (var i = 0; i < chkBoxCount.length; i++) {
if (chkBoxCount[i].checked == true) {
return true;
}
}
return false;
}
return true;
}
but i m not getting the value of the checkbox...
required value:=
ctl00_ContentPlaceHolder1_tc_hospital_improvement_features_tp_Reflection_cbl_116_0
Actual Value:=
ctl00_ContentPlaceHolder1_tc_hospital_improvement_features_tp_complete_stage_chk_confirm
pls help...
first get the runtime generated control into the codebehind file from class file.
and then secondly after getting the control property, we can validate the checbox list.
Get the control into codebehind file from class file.
CheckBoxList cbl = (CheckBoxList)pnlref.FindControl("cbl_116");
provide the javascript validation to the runtime generated checkbox list.
function GetChk(chkbox, args) {
if (!isConfirmed) {
var chkBoxList = document.getElementById('ctl00_ContentPlaceHolder1_tc_hospital_improvement_features_tp_Reflection_cbl_116');
var chkBoxCount = chkBoxList.getElementsByTagName("input");
for (var i = 0; i < chkBoxCount.length; i++) {
if (chkBoxCount[i].checked == true) {
return true;
}
}
return false;
}
return true;
}

How to get a substring from a string variable which is having HTML tags

I have a string variable assigned with some Content in HTML format.
Some thing like this var strLabel:String = "This is <b>Test</b>;
But in run time i have get the first 10 characters of the string and display it in another control.
For this, what did was
txtLabelName.Text = String(strLabel).substr(0,10) + ' ...';
But in the output i am getting as This is <b. Basically it considering HTML related tags also as text. But my code has to omit the HTML tags while calculating sub string.
Please anybody help me to do this?
Use this regexp to strip html tags (more or less):
txtLabelName.text = strLabel.replace(/\<.+?\>/g, '').substr(0, 10) + ' ...';
It's a very simple regexp to strip all tags so it won't work on more complex tags (probably).
I got this code from some blog. This is working Perfectly
public static function stripHtmlTags(html:String, tags:String = ""):String
{
var tagsToBeKept:Array = new Array();
if (tags.length > 0)
tagsToBeKept = tags.split(new RegExp("\\s*,\\s*"));
var tagsToKeep:Array = new Array();
for (var i:int = 0; i < tagsToBeKept.length; i++)
{
if (tagsToBeKept[i] != null && tagsToBeKept[i] != "")
tagsToKeep.push(tagsToBeKept[i]);
}
var toBeRemoved:Array = new Array();
var tagRegExp:RegExp = new RegExp("<([^>\\s]+)(\\s[^>]+)*>", "g");
var foundedStrings:Array = html.match(tagRegExp);
for (i = 0; i < foundedStrings.length; i++)
{
var tagFlag:Boolean = false;
if (tagsToKeep != null)
{
for (var j:int = 0; j < tagsToKeep.length; j++)
{
var tmpRegExp:RegExp = new RegExp("<\/?" + tagsToKeep[j] + "( [^<>]*)*>", "i");
var tmpStr:String = foundedStrings[i] as String;
if (tmpStr.search(tmpRegExp) != -1)
tagFlag = true;
}
}
if (!tagFlag)
toBeRemoved.push(foundedStrings[i]);
}
for (i = 0; i < toBeRemoved.length; i++)
{
var tmpRE:RegExp = new RegExp("([\+\*\$\/])","g");
var tmpRemRE:RegExp = new RegExp((toBeRemoved[i] as String).replace(tmpRE, "\\$1"),"g");
html = html.replace(tmpRemRE, "");
}
return html;
}

Auto save of form

I have form in ASP.NET 3.5. Where lot of data elements and where i have Save and Submit buttions. I need to auto save my form every 2 min. What is the best way to implement this kind of functionility in ASP.NET.
I struggled for awhile with the same problem. The trouble was that I didn't want to save into the usual database tables because that would've required validation (validating integers, currencies, dates, etc). And I didn't want to nag the user about that when they may be trying to leave.
What I finally came up with was a table called AjaxSavedData and making Ajax calls to populate it. AjaxSavedData is a permanent table in the database, but the data it contains tends to be temporary. In other words, it'll store the user's data temporarily until they actually complete the page and move onto the next one.
The table is composed of just a few columns:
AjaxSavedDataID - int:
Primary key.
UserID - int:
Identify the user (easy enough).
PageName - varchar(100):
Necessary if you're working with multiple pages.
ControlID - varchar(100):
I call this a ControlID, but it's really just the ClientID property that .NET exposes for all of the WebControls. So if for example txtEmail was inside a user control named Contact then the ClientID would be Contact_txtEmail.
Value - varchar(MAX):
The value the user entered for a given field or control.
DateChanged - datetime:
The date the value was added or modified.
Along with some custom controls, this system makes it easy for all of this to "just work." On our site, the ClientID of each textbox, dropdownlist, radiobuttonlist, etc is guaranteed to be unique and consistent for a given page. So I was able to write all of this so that the retrieval of the saved data works automatically. In other words, I don't have to wire-up this functionality every time I add some fields to a form.
This auto-saving functionality will be making its way into a very dynamic online business insurance application at techinsurance.com to make it a little more user friendly.
In case you're interested, here's the Javascript that allows auto-saving:
function getNewHTTPObject() {
var xmlhttp;
/** Special IE only code */
/*#cc_on
#if (#_jscript_version >= 5)
try {
xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e) {
try {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
catch (E) {
xmlhttp = false;
}
}
#else
xmlhttp = false;
#end
#*/
/** Every other browser on the planet */
if (!xmlhttp && typeof XMLHttpRequest != 'undefined') {
try {
xmlhttp = new XMLHttpRequest();
}
catch (e) {
xmlhttp = false;
}
}
return xmlhttp;
}
function AjaxSend(url, myfunction) {
var xmlHttp = getNewHTTPObject();
url = url + "&_did=" + Date();
xmlHttp.open("GET", url, true);
var requestTimer = setTimeout(function() { xmlHttp.abort(); }, 2000);
xmlHttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
xmlHttp.setRequestHeader("If-Modified-Since", "Sat, 1 Jan 2005 00:00:00 GMT");
xmlHttp.onreadystatechange = function() {
if (xmlHttp.readyState != 4)
return;
var result = xmlHttp.responseText;
myfunction(result);
};
xmlHttp.send(null);
}
// Autosave functions
var SaveQueue = []; // contains id's to the DOM object where the value can be found
var SaveQueueID = []; // contains id's for binding references (not always the same)
function ArrayContains(arr, value) {
for (i = 0; i < arr.length; i++) {
if (arr[i] == value)
return true;
}
return false;
}
function GetShortTime() {
var a_p = "";
var d = new Date();
var curr_hour = d.getHours();
if (curr_hour < 12)
a_p = "AM";
else
a_p = "PM";
if (curr_hour == 0)
curr_hour = 12;
else if (curr_hour > 12)
curr_hour = curr_hour - 12;
var curr_min = d.getMinutes();
curr_min = curr_min + "";
if (curr_min.length == 1)
curr_min = "0" + curr_min;
return curr_hour + ":" + curr_min + " " + a_p;
}
function Saved(result) {
if (result == "OK") {
document.getElementById("divAutoSaved").innerHTML = "Application auto-saved at " + GetShortTime();
document.getElementById("divAutoSaved").style.display = "";
}
else {
document.getElementById("divAutoSaved").innerHTML = result;
document.getElementById("divAutoSaved").style.display = "";
}
}
function getQueryString(name, defaultValue) {
var query = window.location.search.substring(1);
var vars = query.split("&");
for (var i = 0; i < vars.length; i++) {
var pair = vars[i].split("=");
if (pair[0] == name) {
return pair[1];
}
}
return defaultValue;
}
function urlencode(str) {
return escape(str).replace(/\+/g, '%2B').replace(/%20/g, '+').replace(/\*/g, '%2A').replace(/\//g, '%2F').replace(/#/g, '%40');
}
function AutoSave() {
if (SaveQueue.length > 0) {
var url = "/AjaxAutoSave.aspx?step=" + getQueryString("step", "ContactInformation");
for (i = 0; i < SaveQueue.length; i++) {
switch (document.getElementById(SaveQueue[i]).type) {
case "radio":
if (document.getElementById(SaveQueue[i]).checked)
url += "&" + SaveQueueID[i] + "=" + urlencode(document.getElementById(SaveQueue[i]).value);
break;
case "checkbox":
if (document.getElementById(SaveQueue[i]).checked)
url += "&" + SaveQueueID[i] + "=" + urlencode(document.getElementById(SaveQueue[i]).value);
default:
url += "&" + SaveQueueID[i] + "=" + urlencode(document.getElementById(SaveQueue[i]).value);
}
}
SaveQueue = [];
SaveQueueID = [];
AjaxSend(url, Saved);
}
}
function AddToQueue(elem, id) {
if (id == null || id.length == 0)
id = elem.id;
if (!ArrayContains(SaveQueueID, id)) {
SaveQueue[SaveQueue.length] = elem.id;
SaveQueueID[SaveQueueID.length] = id;
}
}
Add this to your page to make this work:
window.setInterval("AutoSave()", 5000);
And to apply this to a Textbox, DropdownList, Listbox, or Checkbox you just need to add this attribute:
onchange="AddToQueue(this)"
...or this for a RadioButtonList or CheckBoxList:
onchange="AddToQueue(this, '" + this.ClientID + "')"
I'm sure this Javascript could be simplified quite a bit if you used JQuery so you might want to consider that. But in any case, AJAX is the thing to use. It's what Google uses to auto-save your email message in gmail, and the same thing is in blogger when you're writing a new post. So I took that concept and applied it to a huge ASP.NET application with hundreds of form elements and it all works beautifully.
Use the Timer class and the Tick method.

Resources