Textbox value to URL Link - c#

I would like to add a textbox value to my url so I am able to click on a button and open a clients record on the button click. I have tried the below as well as other methods but I am unable to get this working (the below is using a session but I have the client ID value stored in a textbox). Is there a way to do this please?
<asp:Hyperlink runat="server" NavigateUrl='<%# Eval("Client_ID","~/ViewCustomers.aspx?id={0}") %>' />
Result should be ViewCustomers.aspx?id=2 for example.
I am using ASP.NET C# and using HTML 5 for the front end development.
Any help is greatly appreciated.

You can give the HyperLink a class and bind a javascript function to it.
<asp:HyperLink runat="server" CssClass="LinkWithID" NavigateUrl='<%# Eval("ride_id","~/ViewCustomers.aspx?id=") %>' />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
Then simply append the value of the TextBox to the url
<script type="text/javascript">
$('.LinkWithID').click(function () {
location.href = $(this).attr('href') + $(this).next('input').val();
return false;
});
</script>

Related

Calling a function on a HTML check box change without submission using C#

I am using Visual Studio 2015 to create a ASP.NET web site. I have a DIV that is hidden by default and I am trying to display it if the user checks a check box. I am wondering if there is a way using C# to immediately display the DIV as soon as the user checks the box. I can't seem to find a way to recognize the change in state without the form being first submitted. I can easily achieve this using JavaScript however this is for a uni assignment and requires functionality to be implemented in C#.
This is the HTML for the checkBox:
<form id="form1" runat="server">
Limit Stations To My Location<asp:CheckBox ID="limitOptions" runat="server" onClick="toggleOptions()" />
<br /><br />
<div id="locationOptions" runat="server" hidden="hidden">
Radius (KM)<asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
<asp:Button ID="updateList" runat="server" Text="Button" OnClick="updateList_Click"/>
</div>
Any help would be greatly appreciated.
You can do this with C# in code behind. Add a OnCheckedChanged event to the CheckBox and set the AutoPostBack to true and handle the change. Note that a Panel becomes a div in HTML.
<asp:CheckBox ID="limitOptions" runat="server" OnCheckedChanged="limitOptions_CheckedChanged" AutoPostBack="true" />
<asp:Panel ID="locationOptions" runat="server" Visible="false">
Radius (KM) <asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
</asp:Panel>
However this causes a PostBack, so just using JavaScript could be a better option.
<asp:CheckBox ID="limitOptions" runat="server" onclick="toggleOptions()" />
<div id="locationOptions" runat="server" style="display: none">
Radius (KM)<asp:TextBox ID="radius" runat="server" Text="100"></asp:TextBox>
</div>
<script type="text/javascript">
function toggleOptions() {
var id = '#<% =locationOptions.ClientID %>';
if ($(id).css('display') == 'none') {
$(id).slideDown('fast', function () { });
} else {
$(id).slideUp('fast', function () { });
}
}
</script>

Window opened using window.open reopens when browser back button is clicked

I created an asp.net web application which has a linkbutton and hyperlink in the default.aspx. Hyperlink is set navigationurl -"www.google.com". Linkbutton opens the same url in a new tab using javasript's window.open.
Default.aspx
<asp:LinkButton ID="LinkButton1" runat="server" onclick="LinkButton1_Click">Data</asp:LinkButton><br />
<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="http://www.google.co.in">google</asp:HyperLink>
Default.aspx.cs
protected void LinkButton1_Click(object sender, EventArgs e)
{
string url = "http://www.google.com";
ScriptManager.RegisterStartupScript(Page, typeof(Page), "OpenWindow", "window.open('" + url + "');", true);
}
Steps to reproduce my query:
1. Clicks LinkButton. This opens google in new window/tab.
2. Click Hyperlink. This navigates to google.
3. Click Browser Back button.
This time the browser navigates back to default.aspx, simultaneously google opens in new window/tab.
T want this not to happen.
Use Hyperlink Button instead of link button and use target="_blank" and url ="www.google.com" this will open url in new window
No need to use java script to open a new Window .... Also It will Resolve Your Problem
<asp:HyperLink ID="HyperLink2" Target="_blank" NavigateUrl="http://www.google.co.in" runat="server" >Data</asp:HyperLink><br />
<asp:HyperLink ID="HyperLink1" Target="_self" runat="server" NavigateUrl="http://www.google.co.in">google</asp:HyperLink>
here's the code: add the code to the page which you don't want the user to return using back.
if(history.length>0)
history.go(+1);
call it on body load
basically i increment the browser history.
Add this codefunction in your head tag
<script type="text/javascript">
function myfun() {
window.open("http://www.google.co.in");
return false;
}
</script>
and in your body
<asp:LinkButton ID="LinkButton1" runat="server" OnClientClick="return myfun();">Data</asp:LinkButton><br />
<asp:HyperLink ID="HyperLink1" runat="server" NavigateUrl="http://www.google.co.in">google</asp:HyperLink>
Note: Avoid any request to server until and unless its not required,you can also do the same with the help of <a> tag by keeping target="_blank"

Edit mode in grid view can't find the textbox id using getElementById()

In my gridview I have a date column and in edit mode, I place there a date picker. The date picker is in javascript which uses a getElementById() to get/set the value on the textbox.
This is the code of my gridview with the date picker if in edit mode:
<asp:TemplateField HeaderText="Effective Date" HeaderStyle-CssClass="allWidth160" ItemStyle-HorizontalAlign="Center" ControlStyle-CssClass="txtCommon allWidth80 txtCenter">
<ItemTemplate>
<asp:Label runat="server" ID="lblEffDate" Text='<%#DataBinder.Eval(Container.DataItem, "EFF_DATE").ToString()%>'>
</asp:Label>
</ItemTemplate>
<EditItemTemplate>
<asp:TextBox ClientIDMode="Static" ID="EffDate" runat="server" Text='<%#Bind("EFF_DATE") %>' />
<img alt="Calendar" src="../Images/DateTimePickerImg/cal.gif" style="cursor: pointer;" onclick="javascript: NewCssCal('txtEffDate')" />
</EditItemTemplate>
</asp:TemplateField>
I included the javascript file in the HEAD:
<script src="../Library/DateTimePicker.js" type="text/javascript"></script>
When I click the image calendar it has an error somewhere in DateTimePicker.js file which leads to this code:
exDateTime = document.getElementById(pCtrl).value;
Where pCtrl is txtEffDate.
Error: Object required
It seems that it cannot see the object txtEffDate thats why it throws that error. I think that when it is in edit mode, it only show its drawing (the textbox appear) in the browser but its ID is still missing. Any thoughts? TIA
make a new function and pass this .Like this.
onclick = "javascript: NewCssCalClick(this)"
And in js make a new function NewCssCalClick.Like this.
function NewCssCalClick(sender) {
var id = $(sender).prev()[0].id;
NewCssCal(id);
}
Note: You need to add jquery plugin for $ and prev to work
If you are using jQuery you can use
$("[id*='EffDate']")
exDateTime = $("[id*='EffDate']").val();
to get the textbox. As you will have only one text-box at a time. Because you might be editing only one row at a time.
modify the edit item template like below:
add id="imgCalander" runat="server" attributes to calander image and onclick attribute like onclick="fnShowCalander(this.id);"
in javascript define new function like below:
function fnShowCalander(senderID) {
NewCssCal(senderID.replace('imgCalander', 'EffDate'));
}
</script>

How to mask page/Modaldoalog window in hyperlinkfield?

I am using following code in gridview:
<asp:HyperLinkField runat="server" Text="Order" ItemStyle-Font-Underline="true" DataNavigateUrlFields="itemid" DataNavigateUrlFormatString="../Order.aspx?OID={0}" Target="_blank" />
A new popup window opens. But it remains open even if I close the main page(grid). How can I mask this popup ? I need to send ID of row clicked as querystring, hence using this code.
Can anyone help me with best way possible to achieve it and how to do that ? Masking or ModalDialog window or anything else ?
Thanks in Advance !
You can make a TemplateField and put a LinkButton in its ItemTemplate which will call the JS window.showModalDialog method.
<TemplateField>
<ItemTemplate>
<asp:LinkButton id="btn" runat="server" OnClientClick="window.showModalDialog ('http://blah.com/d.aspx?p1=' + '<%# Eval("someField") %>'" ... />
</ItemTemplate>
</TemplateField>

How to apply jQuery UI button to an html button in ASP.NET?

I have a GridView with a button called btnShowTradeScreenshot. The GridView creates many buttons and I want to apply the jQuery button to it. Here's my relevant GridView code:
<asp:GridView
ID="grdTrades"
runat="server"
>
<Columns>
<asp:TemplateField HeaderText="Screenshot" >
<ItemTemplate>
<input name="btnShowTradeScreenshot" runat="server" visible='<%# Eval("screenshotId") != DBNull.Value %>' type="button" value='View...' onclick='<%# "ShowImageInNewPage(\"App_Handlers/ImageHandler.ashx?screenshotId=" + Eval("screenshotId") + "\")" %>' />
</ItemTemplate>
</asp:TemplateField>
</Columns>
</asp:GridView>
I am trying to apply the jQuery using this code:
<script type="text/javascript">
$(document).ready(function () { $("#<%= btnShowTradeScreenshot.ClientID %>").button(); });
</script>
Nothing happens and I get the standard button, not the jQuery button. When I look at the page source, I notice that the buttons have mangled names like:
ctl00$contentMain$grdTrades$ctl05$ctl03
ctl00$contentMain$grdTrades$ctl10$ctl03
etc
Any ideas on how to apply the jQuery to all my buttons?
Thanks.
You could use a class name on the buttons instead of relying on the ClientID; that way you save on JavaScript length and don't need to bind to every specific control.
In JS:
// equivalent to $(document).ready(function() {
$(function() {
$('.customButton').button();
});
In ASP.NET:
<input type="button" runat="server" class="customButton" .../>
Also, if your grid is an AJAX-bound grid, the <input/> elements will be recreated and you'll need to rerun the code on the grid to get the styles applied:
$('#<%= grdTrades.ClientID %> .customButton').button();
Try using a name selector instead:
$('input[name$=btnShowTradeScreenshot]').button();
or even better apply a CSS class to your input and then:
$('.button').button();
There are many buttons created and ASP will generate different IDs for them so as to ensure each one has a unique ID. Since $('#...') is aimed at selecting a single uniquely identified element you cannot use it to select multiple buttons.
Try $(':button') to select all button objects. Alternatively you could set each button's class to something like ShowTradeScreenshot and then select them all with $('.ShowTradeScreenshot').

Categories

Resources