Open a popup / new window from a gridview - VS2010, c# - visual-studio-2010

Can anyone give me any hint on how I can open a new window by selecting a record from a gridview?
Im using response.redirect, and passing a value at present which opens the page fine but Id rather have a popup for this
thanks

You need to bind click event with the row of the grid view control
following code is just demo for you
following javascript open up the pop up window where you need to pass the url you want
<script>
function popWin(url){
window.open(url, '', '');");
}
</script>
follwing is samle code that attch the script with the gridview row to open up popup
code behind
protected void GridView1_RowDataBound(object sender, GridViewRowEventArgs e)
{
if(e.Row.RowType == DataControlRowType.DataRow )
{
string url = "www.google.com";
e.Row.Attributes.Add("onclick","popWin('" + url + "')");
}
}

I had the same issue with response.redirect so went with a asp:HyperLink button instead. I loaded the URL by Binding it through the SQL Database. Here is the code:
<asp:TemplateField HeaderText="Google Map">
<ItemTemplate>
<asp:HyperLink runat="server" ID="hlGMap" Target="_blank" Text="Map" ImageUrl="~/gfx/google.png" NavigateUrl='<%# Bind("GoogleMapsURL") %>' />
</ItemTemplate>
</asp:TemplateField>
Hope it helps.

Related

Setting SelectedValue in a Telerik DropDownList in a RadGrid

I am trying to set the SelectedValue of a RadDropDownList in the EditTemplate of my RadGrid. The DataItemBound event appears to be throwing an error on compilation.
ASP.NET
<telerik:GridTemplateColumn DataField="givenAnswer" HeaderText="givenAnswer" UniqueName="givenAnswer">
<ItemTemplate>
<%# DataBinder.Eval(Container.DataItem, "givenAnswer") %>
</ItemTemplate>
<EditItemTemplate>
<telerik:RadDropDownList ID="ddlGivenAnswer" runat="server" OnItemDataBound="ddlGivenAnswer_DataBound">
<Items>
<telerik:DropDownListItem Text="Yes" Value="Yes" />
<telerik:DropDownListItem Text="No" Value="No" />
</Items>
</telerik:RadDropDownList>
</EditItemTemplate>
</telerik:GridTemplateColumn>
C#
protected void ddlGivenAnswer_DataBound(object sender, GridItemEventArgs e)
{
if ((e.Item.IsInEditMode))
{
GridEditFormItem item = (GridEditFormItem)e.Item;
RadDropDownList ddl = (RadDropDownList)item.FindControl("ddlgivenAnswer");
ddl.SelectedValue = (string)DataBinder.Eval(e.Item.DataItem, "givenAnswer").ToString();
}
}
Error
CS0123: No overload for 'ddlGivenAnswer_DataBound' matches delegate 'DropDownListItemEventHandler'
This error is being throw on the telerik:RadDropDownList open tag line in ASP.NET. What am I missing here?
Main Edit:
Error CS0123:
First typing CS0123 in Google show me that you were using wrong parameter for your event. Probably a copypast fail. Delete the even in the aspx and ask to intelisense to create a new one. Or copypast this one.
protected void ddlGivenAnswer_ItemDataBound(object sender, Telerik.Web.UI.DropDownListItemEventArgs e)
ItemDataBound:
ItemDataBound occure when a data is bound in a control.
I'am pretty sure that inline declaration are not going to fire this event.
Minor Misconception:
Why would someone change the Value of a selected element dynamically?
It's like changing the value of a vote without changing the vote him self or the name on the vote.
What you want is to check the rigth item.
To check Waldo in the drop down list :
ddlGivenAnswer.FindItemByValue("Waldo").Selected = true;
To check the right Item:
ddlGivenAnswer.FindItemByValue(
DataBinder.Eval(e.Item.DataItem, "givenAnswer").ToString()
).Selected = true;

How to undo preventdefault in save event in Kendo Grid

I have a Kendo Grid and set row save event as onAthleteGridSave. I want to add a custom window to set something similar to confirm box. Here is code
function onAthleteGridSave(e)
{
e.preventDefault();
$("#AssignSport").data("kendoWindow").open();
$("#AssignSport").find(".assignsportandsave,.notassignsportandsave")
.click(function () {
if ($(this).hasClass("assignsportandsave")) {
e.model.AssignSportId = $('#AssignEventId').data('kendoDropDownList').value();
}
else if ($(this).hasClass("notassignsportandsave")) {
e.model.AssignSportId = "";
}
$("#AssignSport").data("kendoWindow").close();
})
}
<% Html.Kendo().Window()
.Name("AssignSport")
.Content(() =>
{ %>
...
<input type="submit" class="assignsportandsave" value="Assign Sport And Save" />
<input type="submit" class="notassignsportandsave" value="Not Assign Sport And Save" />
<input type="submit" value="Cancel" onclick="$('#AssignSport').data('kendoWindow').close();" />
...
<%})
The problem is after clicking button in $("#AssignSport").data("kendoWindow"), the program can not go to controller action for Grid which is due to e.preventDefault().
But if removing e.preventDefault(), then program will not wait after $("#AssignSport").data("kendoWindow").open() and immediately go to controller action.
So I want to know if there is a way to undo e.preventDefault() or how to make program wait at where kendo window is opened for button information. Thanks.
You can't undo it, but you can save manually after making your changes to the model by calling saveChanges(). So something like this inside your click handler should work:
e.sender.saveChanges();
$("#AssignSport").data("kendoWindow").close();

Reloading main view after button in PartialView is clicked

I have a partial view that the user can preform a search in, and the search results are shown in a select box. In my main view I have a section that is supposed to show the search results after a select button is pressed. Right now when I click the select button is loads the correct information into the correct model for my main view, but the main view doesn't change. When I click refresh, the page updates correctly. How do I make the page update automatically when a button is clicked in the plugin view?
My section in the main view (Index.vbhtml) in my main app:
#Section CUInfo
Credit Union Name: #Model.CUInfo.CUName
end section
Here is my controller method in my Plugin:
Function ChangeCUInfo(strCUName As String) As ActionResult
m_hostApp.CUInfo.CUName = strCUName
m_hostApp.blnPluginRefreshButtonPressed = True
Return View("Index", m_hostApp)
End Function
I've tried to set a boolean value in the hostApp object and then in my main razor view call this function if it is true:
#code
If Model.blnPluginRefreshButtonPressed = True Then
#<script type="text/javascript">
$(function () {
window.location.reload();
});
</script>
End If
Model.blnPluginRefreshButtonPressed = False
End Code
EDIT:
JS function called when the select button is clicked:
function loadCU(CUInfo) {
strCU = CUInfo.split('|');
strCUName = strCU[0];
$.ajax({
type: "POST",
url: "/CUContractNumberPlugin/ChangeCUInfo",
data: { "strCUName": strCUName }
});
}
Form that is used in the plugin view:
#Using (Html.BeginForm("ChangeCUInfo", "CUContractNumberPlugin"))
#<div id="LogoSigSearch" style="height:300px;width:500px;position:relative;">
<span style="display:inline-block;height:20px;width:166px;position:absolute;top:35px;left:5px;">Credit Union Name</span>
<br />
#Html.TextBox("strCUName")
<input type="submit" name="LogoSigSearch$ctl02" value="Search" id="LogoSigSearch_ctl02" tabindex="3" style="width:60px;position:absolute;top:5px;left:352px;" />
<input name="LogoSigSearch$ctl05" type="button" onclick="javascript:clearSearch()" value="Clear" style="position:absolute;top:35px;left:352px;width:60px;" />
<select size="4" name="LogoSigSearch$ctl06" id="LogoSigSearch_ctl06" tabindex="5" style="height:230px;width:342px;position:absolute;top:65px;left:5px;"></select>
<input type="button" name="SelectCU" value="Select" onclick="javascript:loadCU(LogoSigSearch_ctl06.options[LogoSigSearch_ctl06.selectedIndex].value)" tabindex="4" style="width:60px;position:absolute;top:65px;left:352px;" />
</div>
End Using
Are both buttons part of a form? A button won't invoke an action without you attaching it to script or making it part of a form with an associated action.
Use a partial view to render the results of the query, even on the main page load. This simplifies your development.
Add a jQuery event handler (jQuery.on()) to watch for the button click on your main page, or if the button is returned in the partial view, just use an on ready handler in your partial and attach a button.click() event, again using jQuery.
The jQuery event handler can take care of submitting the values of the query, posting to your controller, and displaying the results. I have a number of older articles here but they are still relevant to your question and demonstrate submitting data and fetching partials.
Your client-side code will end up looking something like this:
$("#your-button").click(function () {
var fetchUrl = '#Url.Action("ActionName", "Controller")';
$.post(fetchUrl, { searchParams: $("#your-search-box").val() })
.success(function (data) {
// replace the contents of the DIV with the results. 'data'
// here has whatever you sent back from your partial view
})
.error(function (data) {
// handle the error, use a DIV with some kind of alert message etc
});
});
Hope this helps some.

Clickable link in RadGrid column

I have a RadGrid where a column in the grid holds a URL. When a put a value in the column I can see the URL but the URL is not clickable (to go to the URL). How can I make the URL clickable?
Here is a rough example of what I'm doing now:
DataTable table = new DataTable();
DataRow row = table.Rows[0];
row["URL"] = "http://www.google.com";
grid.DataSource = table;
In addition I'd really like to show specific text instead of the URL. Something similar to Link in HTML. Is there anyway to do this?
Have you tried the GridHyperLinkColumn? Below is a detailed example.
<telerik:GridHyperLinkColumn FooterText="HyperLinkColumn footer" DataTextFormatString="Search Google for '{0}'" DataNavigateUrlFields="CompanyName" UniqueName="CompanyName" DataNavigateUrlFormatString="http://www.google.com/search?hl=en&q={0}&btnG=Google+Search" HeaderText="HyperLink<br/>Column" DataTextField="CompanyName"></telerik:GridHyperLinkColumn>
You can also view the demosite to see how it works.
http://demos.telerik.com/aspnet-ajax/grid/examples/generalfeatures/columntypes/defaultcs.aspx
Add all the columns manually in the ascx page and make the column you want to contain the hyperlink a GridTemplateColumn:
<telerik:GridTemplateColumn
UniqueName="TemplateLinkColumn"
AllowFiltering="false"
HeaderText="URL">
<ItemTemplate>
<asp:HyperLink ID="Link" runat="server"></asp:HyperLink>
</ItemTemplate>
</telerik:GridTemplateColumn>
Make sure that your grid has an OnItemDataBound method:
<telerik:RadGrid
ID="RadGrid"
runat="server"
AutoGenerateColumns="False"
OnItemDataBound="RadGrid_ItemDataBound" >
In your OnItemDataBound method set the field to the URL:
protected void RadGrid_ItemDataBound(object aSender, GridItemEventArgs anEventArgs)
{
//Get the row from the grid.
GridDataItem item = anEventArgs.Item as GridDataItem;
GridTableCell linkCell = (GridTableCell)item["TemplateLinkColumn"];
HyperLink reportLink = (HyperLink)reportLinkCell.FindControl("Link");
// Set the text to the quote number
reportLink.Text = "Google";
//Set the URL
reportLink.NavigateUrl = "http://www.google.com";
//Tell it to open in a new window
reportLink.Target = "_new";
}
You will also need to check for the correct type, as follows;
if (anEventArgs.Item.GetType().Name != "GridDataItem")
{
return;
}

Setting SqlDataSource SelectParameters from form text box

I am trying to use a text box input as a SqlParameter but it only goes into DataSelecting when the page first loads. Not after the from is submitted.
Here is the code on the aspx page.
protected void DataSelecting(object sender, SqlDataSourceSelectingEventArgs e)
{
e.Command.Parameters["#zip"].Value = ZipBox.Text;
}
"
SelectCommand="SELECT Name FROM Names WHERE (ZipCode = #zip)"
OnSelecting="DataSelecting">
SelectParameters>
parameter Name="zip" DefaultValue="1" />
SelectParameters>
SqlDataSource>
FORM
id="ZipSearch" runat="server" action="Default.aspx" method="post">
TextBox ID="ZipBox" runat="server" />
Button id="btnSubmit" Text="Submit" runat="server" />
FORM
Thanks for your help,
Matt
You need to place that code in the button click event. Selecting event is for different purpose.
Old reply (Before OP's comment) :
What do you have in button click event?
The Selecting event would fire before your select command is executed. Hence if your button click event is firing any command, the Selecting event won't be fired.

Resources