I was following this tutorial:
http://www.hongkiat.com/blog/css3-on-off-button/
I would like everything the same except I would like to change:
<section>
<a rel="external" href="#button" id="button"></a>
<span></span>
</section>
to:
<section>
<asp:Button CssClass="button" id="Button3" runat="server" OnClick="Button3_Click" Text=""\uf011;"" />
<span></span>
</section>
Because of simpler adding buttons and then programming them. Everything works OK, just when I click the button it doesn't become white and the red dot doesn't become green, I guess it's because in the tutorial is button used like a link, and if I add it with visual studio it's not a link, what could I do that i woul style the button like that even if I add it with visual studio.
If you want to have a hyperlink you should use LinkButton element. Button component shows a button element. LinkButton is rendered as a hyperlink with some extra properties.
<asp:LinkButton CssClass="button" id="Button3" runat="server" OnClick="Button3_Click" Text=""\uf011;"" />
Also you can try the following code in order to have code-behind capabilities for a stanrdard a tag.
<section>
<a rel="external" href="#button" id="button" runat="server"></a>
<span></span>
</section>
Another option is using HyperLink component
<section>
<asp:HyperLink Text="" rel="external" href="#button" id="button" runat="server"></asp:HyperLink>
<span></span>
</section>
You should pay attention to anchor's id attribute. I mean, The id attributes are prepended with MainContent_ if you have not set it to be shown only with the value you gave.
There are two options for this:
Change jQuery's selector from $('#button') to $('#MainContent_button')
Change .NET settings for showing your elements without prepending MainContent_ prefix.
Related
I am using <asp:ScriptManager> and link in master page which require <Form> tag but issue is here that i have included already <form> tags in all the child content pages.
I know i just need to include <form> tag just in master page and remove from all child pages but unfortunately its not possible because there are so many content child pages which connected to this master page and also each child <form> tags contains different classes like horizental inline etc.
So i just want that i just want to include <form> tag only in master page if form tag not exist in content/child page.
If i use both in master and child/content, its showing error, its must 1 form tag.
Master page
<form id="Form2" runat="server" novalidate="" role="form" runat="server" class="form-horizontal">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<h3>Session Idle: <span id="secondsIdle"></span> seconds.</h3>
<asp:LinkButton ID="lnkFake" runat="server" />
<cc1:modalpopupextender id="mpeTimeout" behaviorid="mpeTimeout"
runat="server" popupcontrolid="pnlPopup" targetcontrolid="lnkFake"
okcontrolid="btnYes" cancelcontrolid="btnNo"
backgroundcssclass="modalBackground" onokscript="ResetSession()">
</cc1:modalpopupextender>
<asp:Panel ID="pnlPopup" runat="server" CssClass="modalPopup" Style="display: none">
<div class="header">
Session Expiring!
</div>
<div class="body">
Your Session will expire in <span id="seconds"></span> seconds.<br />
Do you want to reset?
</div>
<div class="footer" align="right">
<asp:Button ID="btnYes" runat="server" Text="Yes" CssClass="yes" />
<asp:Button ID="btnNo" runat="server" Text="No" CssClass="no" />
</div>
</asp:Panel>
<asp:ContentPlaceHolder ID="body" runat="server">
</asp:ContentPlaceHolder>
</form>
I just want to use form tag only if not in child page. how can i tackle this situation,
Thanks,
As far as I know, the ASP.NET WebForms do not support multiple form elements with runat="server" attribute. So, there is no work around to this as it is something hard coded into the project.
Anyhow, if there are suppose a thousand child pages that also have form element with runat="server" attribute, and you are too lazy to replace all of them one by one, Then you can use Visual Studio's text replacing feature and can change the form element to a div element. For that you just need to press Ctrl + H which will open a little window on top right corner asking for the text that you want to replace and another text that you want to have instead of that. See:
Notice in the screenshot I have shared, I am selecting Current Project from the drop down menu. This will search and replace every text with <form to <div in the project.
And once it has replaced all the tags starting with <form to <div then you can modify the closing text of the form tag by replacing </form with </div. Now you only have left one page.
Now, there is only the MasterPage left that you can replace back the div to form. So, this way you are manually changing only one page.
You need to click the second button that will replace all the values. There are other options to handle the find and replace that you can use as well. But, unfortunately, you cannot have multiple form tags with runat="server" attributes on it.
PS
It won't cause problem with the designs that you have and classes such as horizontal inline will be applied to those divs instead of forms and will be rendered same as the forms were being rendered on the UI.
It is always a good approach to take a backup before modifying things in bulk or changing something that is crucial and could cause a lot mess.
Let's say I've got an asp:button on a website which I'm trying to track to count how many times it has been clicked by different users.
<asp:Button ID="SubBtn" runat="server" OnClick="Button1_Click" runat="server" Text="Sub" />
In my code behind I've got a redirect link to a different page.
I'm aware that I need to include something like
<a href="#" name="button1" onclick="dataLayer.push({'event': 'button1-click'});" >Button 1</a>
Do I need to convert my asp:button to a html button to make this work?
You need to use attribute "OnClientClick":
<asp:Button ID="SubBtn" runat="server" OnClick="Button1_Click" runat="server" Text="Sub" OnClientClick="dataLayer.push({'event': 'button1-click'});" />
You can read more about this attribute on MSDN: https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.button.onclientclick(v=vs.110).aspx
I would like to add-in on my image button but somehow it's not working. How should I modify it?
Please advice. Thanks.
<asp:Button ID="btn1" runat="server" style="margin-left: 0px;" Text="Search" class="btn btn-info"
style="background-image:url('/Content/Img/Image.png')" >
onclick="Button1_Click1" Width="128px" Height="40px" />
Search Btn Image
You've added two style attributes in your code. Try using only one.
Using multiple style attributes will only apply the style mentioned in the last attribute. You can instead combine the two styles and apply them in a single attribute.
CSS styles can be separated by a ;. Since you already have that on one style, you can just append the other style to it.
Apart from that, your code contains a > in the middle, which shouldn't be there. Fixed code:
<asp:Button ID="btn1" runat="server" style="margin-left:0px;background-image:url('/Content/Img/Image.png')" Text="Search" class="btn btn-info" onclick="Button1_Click1" Width="128px" Height="40px" />
Say I have a dynamically generated LinkButton in my ascx.cs code-behind. How could I go about "printing" this control to my page? Obviously I can't do something like just print the Text property as I need the button to retain its hyperlink. I'm guessing I want to use the WebControl.Render method, but I'm not familiar with it at all and haven't been able to find a good example of its use.
This article http://www.tomot.de/en-us/article/3/asp.net/create-a-control-in-the-codebehind-and-retrieve-its-rendered-output should explain the basics of what you are looking for.
You could provide a label at the right location in the page: <asp:Label id="myLinkButtonPlace" runat="server"></asp:Label>, and in code, you could add the linkbutton to the controlcollection of the label: this.myLinkButtonPlace.Controls.Add(aLinkButton);
Following on from #Joachim VR, there are many other asp.net controls with which you can add a dynamically created control to.
<asp:Label id="Label1" runat="server" />
<asp:PlaceHolder id="Placeholder1" runat="server" />
<asp:Panel id="Panel1" runat="server" />
The above would render HTML different.
So the Label would render as a <span id="Label1"><a></a></span>
Panel as <div id="Placeholder1"><a></a></div>
The Placeholder would simply render as the <a></a>
I am using an asp radio button group to list out answers in a form. Here is an example of the structure.
<asp:RadioButtonList id="Q2" runat="server">
<asp:ListItem Text="Go to <a target='_blank' href='http:www.google.com'>Google</a>" Value="a"></asp:ListItem>
<asp:ListItem Text="Go to <a target='_blank' href='http:www.yahoo.com'>Yahoo</a>" Value="a"></asp:ListItem>
</asp:RadioButtonList>
So I want to be able to click on the links and not have the radiobutton associated with it become selected. In IE it works fine but in Firefox the radio button will be selected when i click on the link. I don't really need the label to actually select the proper radio button so is there a way to just disable them either in javascript or somewhere in the asp or C# code?
It's undoubtedly wrapping them within a label element which is giving you the select behavior. You could either generate the code manually -- my choice -- or unwrap them with javascript on the client side.
<div>
<input type="radio" name="Q2" id="Q2_google" value="google" /> <a target="_blank" href="http://www.google.com">Google</a>
...
</div>
or client-side
$(function() {
$('label:has(a)').each( function() {
var html = $(this).html();
$(this).replaceWith($(html));
});
});
Try this:
<a target='_blank' href='http:www.google.com' click='return false;'>Google</a>"
You can use Enabled="false" in ListItem level
Ex:
Google" Value="a" Enabled="false">