Call JQuery from C# PageLoad - c#

Is there any way how to call JQuery function from PageLoad C# file?
Basically I have some selects, some inputs which are not generated by C# code but are defined in .aspx file manually. When I send form get query to another page I would like to set same variables that are defined in querystring. I know how to do that when I use runat="Server" but I want pure JQuery solutions without having runat="server" objects.
Example:
Select input:
<form method="get" action="/list/search">
<select id="txtSearchFullTyp" name="typ">
<option value="all">Sell, Rent</option>
<option value="1">Sell</option>
<option value="2">Rent</option>
<select>
</form>
Now after sending querystring to another page I am analyzing querystring and running function with defined parameter.
I want to be able to set form to querystring defined as "typ". I dont know how to do it from C# when I dont have runat="Server" option.
Is there a way to do this?
Thanks.

Here's a code for it. It's quite hacky but nevertheless it answers your question:
<form method="get" action="/list/search">
<select id="txtSearchFullTyp" name="typ">
<option value="all">Sell, Rent</option>
<option value="1">Sell</option>
<option value="2">Rent</option>
<select>
</form>
<asp:Literal runat="server" ID="litJqueryCode"/>
and from the code behind you can do the following
litJqueryCode.Text = "<script type='text/javascript'>$(function(){ $('#txtSearchFullTyp').val('"+ Request.QueryString["dropdownValue"] +"') })</script>";

Related

ASP.NET MVC OnChange Razor

I have searched if there is any way that ASP.NET MVC can handle OnChange event without using neither Javascript but all the results return the OnChange of DropdownList...
Is there any way to achieve this? I want to OnChange an file input to post file data.
<select id="myElement">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
</select>
you can use javascript code
document.getElementById("myElement").addEventListener("change",function(e){
e.currentTarget.value
});
Without JavaScript, no, if you want to do anything dynamically, you need JavaScript.
As HTML is just for markup, and nothing else, you'll have to have the page refresh, or use JavaScript.

Accessing htmlcontrols from codebehind

Is there any way to access html controls in ASP.net code behind.
Some control similar to Findcontrol() to access the html controls. I am using
HtmlSelect htsel1;
htsel1 = (HtmlSelect)FindControl("stage_txt1");
but htsel1 is returning null.
You need to add runat=server and an ID.
aspx:
<select id="stage_txt1" runat=server" >
<option value="1">stage 1</option>
<option value="2">stage 2</option>
<option value="3">stage 3</option>
<option value="4">stage 4</option>
</select>
codebehind:
HtmlSelect myDdl = (HtmlSelect)FindControl("stage_txt1");
or just use the servercontrols like Panel instead of div or TextBox instead of HtmlInputText or DropDownList instead of HtmlSelect and so on.
If the page is the NamingContainer( they are not nested in child-controls like Repeater) you can also access them directly without to use FindControl.
HtmlSelect myDdl = this.stage_txt1;
You need the runat="server" attribute. For instance:
<div id="myServerSideDiv" runat="server"></div>
Just give the html element a runat="server" and id attribute and the control will be accessable from code behind

include aspx file in other aspx file

<% if (Session["desig"].ToString() == "Developer"){%>
<td>
<select name='zone' id="zone" onchange="showLoc(this.value,'mlodg_loc')">
<option value="Select Zone">Select Zone</option>
<option value="East">East</option>
<option value="West">West</option>
<option value="North">North</option>
<option value="South1">South1</option>
<option value="South2">South2</option>
<option value="South3">South3</option>
</select>
</td>
<%}
else
{%>
<td>
<select name='zone' id="Select1" onchange="showLoc(this.value,'mlodg_loc')">
<option value="Select Zone">Select Zone</option>
<option value="<%#Session["zone"]%>"><%# Session["zone"].ToString() %></option>
</select>
</td>
<%}%>
the code above is working fine if I am writing it directly, I tried to write this code in other file and in main file i did Response.WriteFile("zone.aspx")
How can i include it is there any way to include and also would like to know a better way to write the above statements.
Thankyou
UserControls are there in asp.net for this purpose, make a .ascx file for this piece of code u have, and use it as a control anywhere.
Response.WriteFile just writes the filecontents into the Http response stream, without parsing it.
Although it is possible to use Server Side includes in asp.net (<!--#include file="xxx.ext" -->), this has an asp-classic code smell to it IMO.
The better way to get re-use of .aspx components is by using a User Control (.ascx).
Similar question here
Update
Response.WriteFile is fine for plain Html, .css or .js, but not for code containing c# or referencing .Net objects (you've used Session in your code), e.g.
Response.WriteFile("HtmlSnippet.html")
where HtmlSnippet.html is
<p>In breaking news, scientists have discovered a planet in
<a href='http://en.wikipedia.org/wiki/Alpha_Centauri_Bb'>Alpha Centauri</a>
</p>
Using a Server Side Include, e.g. <!--#include file="file.inc" --> would allow you to do put something like this in file.inc:
<% if (Session["desig"].ToString() == "Developer"){ %>
You are a Developer!!
<% } %>
However, the recommendation is to use a User Control (.ascx), which allows you to do much the same as the server side include, but just in a much more reusable, object oriented, and testable fashion. Your reusable Control will be a first class object, with properties, methods and be able to raise events. You'll need to do some research here.
Response.WriteFile does not process the code on the server side. It simply takes the contents of html and pipes it to the browser.
If your code contains code blocks that must be processed by the server you can use this handy feature:
<div ID="menuContent" runat="server">
<!-- #Include virtual="/menu.aspx" -->
</div>
In my menu.aspx file I have raw html and some C# codeblocks and ASP will resolve those after inserting the content into the page. Great huh?

html escape characters

I have the following:
<form name="input" method="get" action="http://site:8083/Default.aspx?DC=" target="foo" onSubmit="window.open('', 'foo', 'width=1100 height=500,status=no,resizable=yes,scrollbars=yes')">
<select name="DC">
<option value="1&Type=type1">1</option>
<option value="2&Type=type2">2</option>
<option value="3&Type=type3">3</option>
<option value="4&Type=type4">4</option>
<option value="5&Type=type5">5</option>
<option value="6&Type=type6">6</option>
<option value="7&Type=type7">7</option>
</select>
<input type="submit" value=">>"/>
</form>
Basically my querystring should be something like DC=1&Type=type1 the problem I have is that when I click the >> button above the html screws up the stirng by changing & to %26 and = to %3D
How can I make the value stay as I have it in the code above?
Yes, that's the expected behaviour, the HTTP GET works this way, values are encoded to difference from keys. In GET, browsers append key=value pairs separated by '&' and starting with a '?'; you shouldn't specify them by yourself in the url.
I think you should change your code in this way, maybe it's what you want to get:
<form name="input" method="get" action="http://site:8083/Default.aspx" target="foo" onSubmit="updateType()">
<select name="DC">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<!-- etc... -->
</select>
<input type="hidden" name="Type"/>
<input type="submit" value=">>"/>
</form>
and in Javascript...:
function updateType(){
// set up 'Type'
document.forms[0].Type.value = 'Type' + document.forms[0].DC.value;
// open popup
window.open('', 'foo', 'width=1100 height=500,status=no,resizable=yes,scrollbars=yes')
return true;
}
Forms are designed to submit key/value pairs of data where the key is the name of the control and the value is the value. They will not mash arbitrary strings together.
Design your server side program to expect input in the format the forms are designed to use.
...and this is correct. Request-Parameters [get] should be encoded.
When you get the Request, your Server should decode them [apache/php] or i don't know ASP but in php it gaves a function called urldecode() ...
Try using:
HttpUtility.UrlDecode()
Further reading
So what you're trying to do is have two different query string set to two different values when a single item on your form is set. While your attempted solution is a neat idea, clearly the browser is actively preventing you from using that method (for security reasons) and rightly so. I see two solutions that would work well for you.
Use the form to send just one query string (i.e. DC) and on the server side, determine what the value of 'Type' should be. If it's really, really important to have both values as query strings (for example you're re-using a Control that only looks at those query strings) then use Server.Transfer on the server side to add the additional query string(s).
Provide two types of inputs on the form. One being the select box that you have there, another being either a hidden select box, a hidden input field, or whatever else fits for you. Add Javascript to the page such that when the selection is changed on the visible select box you set the hidden field to the correct value, then when the form is submitted both inputs are each submitting only one query string, as the browser is designed to support.
Here's an implemention of choice #2:
<script type="text/javascript">
var DCMapping = new Array();
DCMapping["1"] = "type1";
DCMapping["2"] = "type2";
DCMapping["3"] = "type3";
DCMapping["4"] = "type4";
DCMapping["5"] = "type5";
DCMapping["6"] = "type6";
DCMapping["7"] = "type7";
function selectionChanged(selectBox)
{
alert(DCMapping[selectBox.value]);
document.getElementById('hidType').value = DCMapping[selectBox.value];
}
</script>
<form name="input" method="get" action="http://site:8083/Default.aspx" target="foo"
onSubmit="window.open('', 'foo', 'width=1100 height=500,status=no,resizable=yes,scrollbars=yes')">
<select name="DC" onchange="selectionChanged(this)">
<option value="1">1</option>
<option value="2">2</option>
<option value="3">3</option>
<option value="4">4</option>
<option value="5">5</option>
<option value="6">6</option>
<option value="7">7</option>
</select>
<input type="hidden" name="Type" id="hidType" value="1" />
<input type="submit" value=">>"/>
</form>
You should use:
HttpUtility.UrlDecode();
To convert escape characters in the url
You can remove the method and action from the <form>. Instead extend the JavaScript/VBScript to pick up the value of the selected option and catenate it with the url root.
You don't need to mess with url decoding, the %.. should work fine as-is.

How do I make my ASP.NET page encode the value selected in a listbox as a parameter to an HTTP request URL?

I have a listbox on an ASP.NET page:
<select id="Language" multiple size="5" name="Language" runat="server">
<option value="English" selected>English</option>
<option value="French">French</option>
<option value="German">German</option>
</select>
and the form that contains that listbox has a "Submit" button
<asp:Button id="btnPost" runat="server" text="Submit"
postbackurl="ProcessData.asmx"/>
I'd like the page to form a request to ProcessData.asmx?Language=X when X is selected in the listbox.
How do I achieve that?
Your select simply have to be a part of form. As form submitted it submit all inside control values to action.
<form id="submit" action="ProcessData.asmx" runat="server">
<select id="Language" multiple size="5" name="Language" runat="server">
<option value="English" selected>English</option>
<option value="French">French</option>
<option value="German">German</option>
</select>
<input type="submit" text="Submit form"/>
</form>
Submit button with do job for you :)
I suggest that you do the following:
1) Hook on the OnClientClick event of the submit button.
2) Cancel that event using return false.
3) In the OnClientClick event handler send manually a GET request to ProcessData.asmx using XmlHttpRequest and append the needed query string parameter.. I suggest that you use 3rd party JavaScript Ajax library to do that. Here is short example using jQuery:
<script type="text/javascript">
function clientClick() {
var $ = jQuery;
$.get(
url = "ProcessData.asmx",
data = { Language : $get('<%= Language.ClientID %>').value }
);
}
</script>
<asp:Button runat="server" ID="Button1" Text="Postback" OnClientClick="clientClick(); return false"/>
You should be able to get the value on the target page using Request.Form["Language"]
Or set the OnClientClick attribute to
"javascript:WebForm_DoPostBackWithOptions(new WebForm_PostBackOptions('btnPost', '', '', false, '', 'ProcessData.asmx?Language=' + GetSelectedLang();, false, false))"
and add GetSelectedLang() javascript function your page.

Categories