Call ASP.net function / method from div onclick - c#

I have a basic url redirect on a DIV's onclick.
<div onclick="location.href = 'page.aspx';">
I have a need to do some work server side, rather than just a redirect, when this Div is clicked.
How do I call one of my code behind functions from the DIV onclick? The DIV is the parent control inside a usercontrol. I suppose I can "fix" it by using a literal control and writing a query string into the onclick, but I would use that as a last resort as I don't want to use a query string.
Are there any other ways of catching a DIV click in code behind that I may have missed?

You can have a button whose display can be 'none'.
Handle click of Div on client side and then from there fire the Click of that button and handle the thinks Server Side on the Click Event of the button.
<asp:Button runat="server" id="btnHidden" style="display:none" onclick="btnHidden_OnClick" />
<div onclick="javascript:DivClicked(); return true;"></div>
<script>
function DivClicked()
{
var btnHidden = $('#<%= btnHidden.ClientID %>');
if(btnHidden != null)
{
btnHidden.click();
}
}
</script>

Related

How to check whether ASP.NET button is clicked or not on page load

How can I check whether a particular button was clicked or not in ASP.NET?
I think I need to perform some operation on Page_Load. This shouldn't be entering to Button_Click event to find. Is there any way that I can find where it was clicked or not on Client Side and take it to Page_Load?
Background: Basically __EVENTTARGET and __EVENTARGUMENT , These two Hidden controls are added to the HTML source, when ever any autopostback attribute is set to true for any of the web control.
The __EVENTTARGET hidden variable will tell the server ,which control actually does the server side event firing so that the framework can fire the server side event for that control.
The __ EVENTARGUMENT variable is used to provide additional event information if needed by the application, which can be accessed in the server.
So we can easily get the control causing postback using:Request.Params.Get("__EVENTTARGET");
PROBLEM:
The method: Request.Params.Get("__EVENTTARGET"); will work for CheckBoxes, DropDownLists, LinkButtons, etc.. but this does not work for Button controls such as Buttons and ImageButtons
The Button controls and ImageButton controls does not call the __doPostBack function. Because of this, the _EVENTTARGET will always be empty. However, other controls uses javascript function __doPostBack to trigger postback.
So, I will suggest to do something as below. Add an OnClientClick property to the buttons. Also, define a hiddenField in your Markup, whose value will contain the actual button causing postback.
<asp:Button ID="Button1" runat="server" Text="Button"
OnClientClick = "SetSource(this.id)" />
<asp:ImageButton ID="ImageButton1" runat="server"
OnClientClick = "SetSource(this.id)" />
<asp:HiddenField ID="hidSourceID" runat="server" />
On the OnClientClick property of the Button and ImageButton Call the SetSource JavaScript function
<script type = "text/javascript">
function SetSource(SourceID)
{
var hidSourceID =
document.getElementById("<%=hidSourceID.ClientID%>");
hidSourceID.value = SourceID;
}
</script>
Here onwards, you can very easily check in your Page_Load as to which Control caused postback:
if (IsPostBack)
{
string CtrlName;
CtrlName=hidSourceID.Value;
}
I just got the same trouble, have to do some logic judgement in the Page_Load method to treat different event(which button was clicked).
I realize the arm to get the as the following example.
The front end aspx source code(I have many Buttons with IDs F2, F3, F6, F12.
<Button Style="display: none" ID="F2" runat="server" Text="F2:Cancel" OnClientClick="SeiGyo(this)" OnClick="F2_Click" />
<Button Style="display: none" ID="F3" runat="server" Text="F3:Return" OnClientClick="SeiGyo(this)" OnClick="F3_Click" />
<Button Style="display: none" ID="F6" runat="server" Text="F6:Run" OnClientClick="SeiGyo(this)" OnClick="F6_Click" />
<Button Style="display: none" ID="F12" runat="server" Text="F12:Finish" OnClientClick="SeiGyo(this)" OnClick="F12_Click" />
The back end aspx.cs source code, what I need to do is judge which button was clicked when Page_Load was triggered. It seems a little stupid, but works.
In your situation, the button be clicked will be added into dic. I hope that will be helpful to some one.
Dictionary<string, string> dic = new Dictionary<string, string>();
foreach(var id in new string[]{"F2","F3","F6","F12"})
{
foreach (var key in Request.Params.AllKeys)
{
if (key != null && key.ToString().Contains(id))
dic.Add(id, Request[key.ToString()].ToString());
}
}
The UniqueID of the button will be in Request.Form["__EVENTTARGET"]
This question is already answered at: ASP.NET : Check for click event in page_load
You can try using the hidden field. Make the client side event on the OnclientClick event and try setting the value of hidden field, may be true or false depending on the condition.
And on the page load you can check the value of Hiidden field.
function click()
{
// set the hidden field here
}
And on the page load, simply check the value.
if(HiddenFieldName.Value=="true")
{
//perform the action
}
private bool button1WasClicked = false;
private void button1_Click(object sender, EventArgs e)
{
button1WasClicked = true;
}
if ( button1WasClicked== false)
{
//do somthing
}

How to get the div display property in c#.net before i changed div property in javascript

i Have one div in my default web page . The div style display none, that time in page load event i have to get the status none, but the div status changed in javascript function based on dropdown selection that i dosenot get the none status always show "" status, my code is
aspx page
<div id="Div1" runat="server" clientidmode="Static" style="display: none;">
pageload event
string Display1 = "";
Display1 = Div1.Style["display"]; (working fine)( get the display1 value=none)
when i button click show the div like that in c# code
Div1.Style.Add("display", "");(now show the div it is correct)
Dropdown Changed fire javascript function code
document.getElementById('Div1').style.display = 'none'; (after change dropdown Hide the div after pageload i got Display1 value="")
After changed javascript function i doenot get the none status in page load
you can use like this it's below
<script type="text/javascript">
$(function () {
$("#lnkCompany").click(function () {
if ($("#dvClientReg").css('display') == 'block') {
$("#dvClientReg").css('display', 'none');
}
if ($("#dvCompanyReg").css('display') == 'none') {
$("#dvCompanyReg").css('display', 'block');
}
});
});
</script>
i think this will help you
DIV is a HTMLGenericalControl in ASP.Net and any changes you make it in the client to its style or attributes, i dont think it will be posted back to server, instead you can track the changes on a Hidden control which has runat server attribute to true and capture the changes.
let me know if it helps

Send HTML Parameter to button click event in ASCX child control

I'm trying to access some page HTML to use for an email in a Button_Click event.
I cannot set this content easily anywhere else at runtime (Such as in a TAG).
So I'm wondering if I can use JQuery to set a variable to .innerHtml(), and pass that in the button click. How would I go about doing this?
Something like this...
<div id="myDiv">
some content...
</div>
<asp:HiddenField ID="hdnHtml" ClientIDMode="Static" runat="server" />
<script type="text/javascript">
$(function () {
$('#hdnHtml').val($('#myDiv').html());
});
</script>
To add a hidden field to a form: fill its value using javascript/jQuery and submit the form via a Button_Click event.

Store innerhtml by jQuery in asp.net?

I have
<div id="ulAndil" runat="server">
</div>
and button
<asp:Button ID="btnAssignJudToCourse" runat="server" Text="تاكيد "
CssClass="button" CausesValidation="false"
OnClientClick="javascript:getShape();"
OnClick="btnAssignJudToCourse_Click" Visible="false" />
At runtime I create a lot of sortable html controls and then click confirm
I want to save inner html of this div before postback of button in session or anything
Using jQuery so when user click the button jQuery take inner html of div and stores it in cookie session any thing to store it after postback I can retrieve it
Please I want the exact code for this jQuery or javascript method and how to call on button
Why don't you put the generated HTML in a hidden field and postback.
Say getShape() is your javascript function
function getShape()
{
//your validations applied
document.getElementById('hdnHTML').value = document.getElementById('ulAndil').value;
return true;
}
where hdnHTML is the hidden element of HTML.

Hide div on clientside click

Trying to get this div to disappear, does not seem to doing what I expect it to do, where am I going wrong?
It does not disappear.
Javascript:
<script type="text/javascript">
function Show_Hide_Display() {
var div1 = document.getElementById("checkAvailability");
if (div1.style.display == "" || div1.style.display == "block") {
div1.style.display = "none";
}
else {
div1.style.display = "block";
}
return false;
}
</script>
HTML:
<div runat="server" id="checkAvailability">
<asp:LinkButton OnClientClick="Show_Hide_Display()" ID="lbtnCheckAvailability" runat="server" CausesValidation="true" OnClick="lbtnCheckAvailability_Click">Check availability
</asp:LinkButton>
</div>
I want the button to pretty much hide itself.
Change your line to:
var div1 = document.getElementById("<%=checkAvailability.ClientID%>");
The reason is that when the checkAvailability control is rendered on the client side it may or may not have the same id (checkAvailability) since asp.net will prepend its id with that of the container control or some other logic.
This <%=checkAvailability.ClientID%> will always give you the actual id on the client side.
I think you will be better of looking at some jQuery here. For example, your code could look like:
$(document).ready(function(){
$('#yourbutton').click(function(){
$(this).toggle();
});
});
Of course, in your case you can also hide the wrapping div if you want that for some reason. It's about the same approach.
In addition to what #Icarus has posted, modify your code as such.
OnClientClick="return Show_Hide_Display()"
this will stop a post back from happening. i'm guessing you don't want a postback to occur since your div/button will be visible after a postback.
the problem is linkbutton causes postback, thus div visibility, set by JS, after postback will be restored to it's default value. i.e. style.display will not be saved. a simple solution will be just add simple html button. like this
<input type="button" value="hide the div" onclick="Show_Hide_Display()" />
this just triggers JS, not causing postback, and your div visibility will alter as expected.

Categories