I have a checkbox, a drop down list and a text box.
I want to disable the drop down and text box on deselecting the checkbox.
Following is what I have on my view -
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<%Html.CheckBox("chkCheckMe", new { enabled = Convert.ToBoolean(ViewData["ShowFlag"])}); %>>
<%Html.DropDownList("ddlModes", new SelectList(new string[]{"Auto", "Manual"}), new { enabled = Convert.ToBoolean(ViewData["ShowFlag"])}); %>
<%Html.TextBox("txtSample", new {enabled = Convert.ToBoolean(ViewData["ShowFlag"]) }); %>>
</asp:Content>
Can I do this using script?
Thanks,
Kapil
This should get you started
<script type="text/javascript">
window.onload = function() {
var c = document.getElementById("yourCheckboxID");
c.onclick = toggleElements;
}
function toggleElements() {
var c = document.getElementById("yourCheckboxID");
var d = document.getElementById("yourDropDownID");
var t = document.getElementById("yourTextBoxID");
d.disabled = t.disabled = c.checked;
}
</script>
Related
I need to get a list of innerHTML strings from a website (for example facebook) to my .NET application.
Is there a way to get results from the following function into my application (i would put this data into a list) :
var data = new Array();
for(i=0; i<document.getElementsByClassName("class-name").length;i++)
data.push(document.getElementsByClassName("class-name")[i].innerHTML);
The code above outputs exactly the data i need, now my question is if it's possible to somehow get this data into my c# list?
This is how I'd like it to look :
var JS_DATA = data; //get the js array as a variable
static List<string> data = new List<string>(); //make a new list
foreach (string str in JS_DATA)
data.Add(String.Format("{0}", str)); //add the whole js array to the list
Here is an example:
see hidden Field array_store
Client side:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
var array_store;
window.onload = function () {
array_store = document.getElementById("array_store");
document.getElementById("array_disp").innerHTML = array_store.value;
};
function UpdateArray() {
var arr;
if (array_store.value == "") {
arr = new Array();
} else {
arr = array_store.value.split(",");
}
arr.push((arr.length + 1).toString());
array_store.value = arr.join(",");
};
</script>
</head>
<body>
<form id="form1" runat="server">
<span id="array_disp"></span>
<br />
<asp:Button ID="btnSubmit" runat="server" Text="Submit" OnClientClick="UpdateArray()" />
<input type="hidden" id="array_store" name = "ArrayStore" value = '<%=this.ArrayStore %>' />
</form>
</body>
</html>
C#:
protected string ArrayStore = "";
protected void Page_Load(object sender, EventArgs e)
{
this.ArrayStore = Request.Form["ArrayStore"];
}
I have two text boxes named txtbalance and txtdays. If I enter greater value in txtdays than txtbalance I want show error message. I have a javascript method but it not working.
<script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js">
</script>
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$("#txtdays").on('input', function () {
var txtbalance = $('#txtbalance').val();
var txtdays = $('#txtdays').val();
if (txtbalance === "" || txtdays === "") return false;
if (parseInt(txtbalance) < parseInt(txtdays)) {
alert("u cant apply");
}
});
});
</script>
And my sourse code
<% Page Title="Home Page" Language="C#" MasterPageFile="~/Site.master" AutoEventWireup="true"
CodeBehind="Default.aspx.cs" Inherits="drop._Default" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<style type="text/css">
.style1
{
width: 100%;
}
</style>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<head>
<script type="text/javascript" language="javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function () {
$("#txtdays").on('input', function () {
var txtbalance = $('#txtbalance').val();
var txtdays = $('#txtdays').val();
if (txtbalance === "" || txtdays === "") return false;
if (parseInt(txtbalance) < parseInt(txtdays)) {
alert("u cant apply");
}
});
});
</script>
</head>
<table class="style1">
<tr>
<asp:TextBox ID="txtbalance" runat="server"></asp:TextBox>
</tr>
<tr>
<asp:TextBox ID="txtdays" runat="server"></asp:TextBox>
</tr>
</asp:Content>
please help me reach a solution...
if the balances are numbers, you most likely need to use parseInt. LIke this:
if (parseInt($('#txtbalance').val()) < parseInt($('#txtdays').val())) {
alert("u cant apply")
}
$(document).ready(function () {
var n = $("#txtbalance").val();
var m = $("#txtdays").val();
if(parseInt(n) > parseInt(m)) {
alert("Alert!");
}
});
Add event handler to change event of text boxes and compare values.
<script language="javascript" type="text/javascript">
var bal='';
var days='';
$(document).ready(function () {
$( "#txtbalance" ).change(function() {
bal=$(this).val();
return compare(bal,days);
});
$( "#txtdays" ).change(function() {
bal=$(this).val();
return compare(bal,days);
});
});
function(bal,days)
{
if(bal!='' && days!='' && parseInt(bal)<parseInt(days))
{
alert("u cant apply");
return false;
}
return true;
}
</script>
I would use key up method :
$("#txtdays").on('keyup', function () {
// your code here
}
http://jsfiddle.net/y7hgwyvy/ - jquery 1.7
$(document).ready(function () {
$("#txtdays").on('input', function () {
var txtbalance = $('#txtbalance').val();
var txtdays = $('#txtdays').val();
if (txtbalance === "" || txtdays === "") return false;
if ( parseInt(txtbalance) < parseInt(txtdays) ) {
alert("u cant apply");
}
});
});
you can also think about some delay when user typing value in txtdays input.
EDIT
solution for jquery 1.4 http://jsfiddle.net/y7hgwyvy/1/
I've created an User Control where I have a button. And when this button is clicked a jquery function is executed. The jquery function is inside the User Control page.
Now i'm trying to add this User Control dynamically in my page, inside an UpdatePanel.
The problem is that my button is not working.
After i google it, i found out that maybe the problem is in using jquery inside ajax UpdatePanel. After every asynchronous postback the jquery script is lost. So the idea is to rebind my jquery function in every asyn postback. But in the all answers that i found, they kinda suppose that the script manager is in User control and it's not in my case.
Here my jquery fucntion
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script type="text/javascript">
$(function () {
$("#<%= idButtonLeft %>").bind("click", function () {
var options = $("#<%= idListDestinataire %> option:selected");
for (var i = 0; i < options.length; i++) {
var opt = $(options[i]).clone();
$(options[i]).remove();
$("#<%= idListSource %>").append(opt);
}
});
$("#<%= idButtonRight %>").bind("click", function () {
var options = $("#<%= idListSource %> option:selected");
for (var i = 0; i < options.length; i++) {
var opt = $(options[i]).clone();
$(options[i]).remove();
$("#<%= idListDestinataire %>").append(opt);
}
});
});
</script>
the code to add my User control dynamically
Dim CListBox As UserControl = LoadControl("DragDropList.ascx")
CListBox.ID = "CListBox" + i.ToString()
CType(CListBox, DragDropList).idListSource = "ListLeft" + i.ToString()
CType(CListBox, DragDropList).idListDestinataire = "ListRight" + i.ToString()
CType(CListBox, DragDropList).idButtonLeft = "idButtonLeft" + i.ToString()
CType(CListBox, DragDropList).idButtonRight = "idButtonRight" + i.ToString()
UpdatePanel1.ContentTemplateContainer.Controls.Add(CListBox)
Panel1.Controls.Add(CListBox)
in my page i have this
<asp:UpdatePanel ID="UpdatePanel1" UpdateMode="Conditional" runat="server">
<ContentTemplate>
<asp:Panel ID="Panel1" runat="server">
</asp:Panel>
</ContentTemplate>
<Triggers>
<asp:AsyncPostBackTrigger ControlID="ImageButton1" />
</Triggers>
</asp:UpdatePanel>
<asp:ImageButton ID="ImageButton1" ImageAlign="Right" EnableViewState="false" ImageUrl=".\image\ajouter.png" runat="server" AlternateText="Ajouter" OnClick="AjouterC"/>
So please any ideas to help.
Thank you
When i changed the trigger on PostBackTrigger, it's working but i want it in asynchrone postback. and still don't know why it's not working!
Use This
<script type="text/javascript">
Sys.WebForms.PageRequestManager.getInstance().add_endRequest(EndRequestHandler);
function EndRequestHandler(sender, args) {
if (args.get_error() == undefined) {
$(function () {
//Your script
});
}
}
</script>
This will work on post back that your update panel is giving to you.
I am refactoring the web project,where java script and css code is written inside the .aspx file.Now I am removing java script and css code from the aspx files and maintaining that the code in respective css and js files with their reference in aspx files.
It is straight forward for me if java script code is written in one place and inside the funtion.Here in the example code not all java script code is inside the function and some of the script are inside the div block.I am not able to put these script in separate file.Moreover I am new bee in Java script and web development please help me on this.
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<script type="text/javascript">
-------code-----------
</script>
<% Html.EnableClientValidation(); %>
<% using (Html.BeginForm())
{%>
<%: Html.ValidationSummary(true) %>
<div class="formColWhole" style="width: 935px;">
<script type="text/javascript">
document.body.style.cursor = 'default';
document.forms[0].action = '<% = ViewData["RegisterPageUrl"].ToString() %>';
function IndicateProcessing() {
if (typeof (Page_ClientValidate) == 'function') {
if (Page_ClientValidate() == false) { return false; }
}
var cancelButton = document.getElementById("<% = buttonCancel.ClientID %>");
if (cancelButton != null) {
cancelButton.disabled = true;
}
document.body.style.cursor = 'wait';
return true;
}
function submitForm() {
IndicateProcessing();
// _gaq.push(['_trackEvent', 'Register', 'Register submit Click', 'Register submit']);
// avoid duplicate submission
var button = $("#buttonSend");
button.attr('disabled', true).html('');
document.forms[0].submit();
}
</script>
</div>
<div class="formColWhole" style="width: 100%;">
--------code----
</div>
<script type="text/javascript">
var selectCountryText = document.getElementById("<% = selectCountry.ClientID %>").value;
var regions = document.getElementById("region");
regions.firstChild.text = selectCountryText;
</script>
</asp:Content>
I am trying to get a value from a textbox so that that I can rotate an Image using jQuery
<script src="Scripts/jQueryRotate.2.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
var angle = $("input:TextBox1").val();
$("#needle").rotate(angle);
alert(angle);
});
</script>
And I'm populating the textbox as follows
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
WeatherLibrary.WeatherData wLib = new WeatherLibrary.WeatherData();
double dataLatest;
string sensorName;
sensorName = "umtAdjWinDir";
double dir = wLib.GetLatestData(sensorName).Value;
dir = Math.Round(dir, 0);
TextBox1.Text = dir.ToString();
}
</script>
TextBox1 is the the id of the textbox
<asp:TextBox ID="TextBox1" runat="server" ReadOnly="True"></asp:TextBox>
The alert I have given says undefined and the image never gets rotated.
Try
var angle = $("#TextBox1").val();
OR
var angle = $("#<%= TextBox1.ClientID %>").val();
If TextBox1 is the id of the input element you can use var angle = $("#TextBox1").val(); to get the value form the textbox
Try using :
var angle = $('#<%=TextBox1.ClientID%>').val();
try
var angle = $("input#TextBox1").val();
assuming you have an input with id="TextBox1"
I think not sure it may be a problem of master page or user control.
<script src="Scripts/jQueryRotate.2.2.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
var angle = $("#TextBox1").val();
$("#needle").rotate(angle);
alert(angle);
});
</script>
Supposed to be
var angle = $("input[id*='TextBox1']").val(); // For ID
var angle = $("input.TextBox1").val(); // For class
var angle = $("[id*='TextBox1']").val(); // For ID this is sufficient
Need to use attribute ends with $ or attribute contains selector * if you are using ASP.NET controls with runat="server" attribute
$("#TextBox1").val() this code will help u out to get the textbox value..