how to access iframe textbox id in current page? - asp.net

Friends I have a Parent Page(default.aspx) that includes an iframe page(iframe.aspx) containing textbox in the field. The parent page contains the "Save" button. Now i want to get the values of iframe page while submitting the parent page. How can i access the iframe pages fields in parent page submit?
iframe.aspx page,,,,
In Iframe page i have two textbox,,
<asp:textbox id="txtfromdate" runat="server"></asp:textbox>
<asp:textbox id="txttodate" runat="server"></asp:textbox>
default.aspx page
<iframe id="iframebody" runat="server" src="iframe.aspx" style="width:900px; height:600px"></iframe>
<asp:button id="submit" text="save" runat="server" />
frdz how to access iframe page id(txtfromdate, txtTodate) in parrent page(default.aspx) when i click on button??

Try this javascript on the button click.
HTML
<input type="hidden" id="txtHidData" runat="server" />
Javascript
var iframe = document.getElementById('iframebody');
var innerDoc = iframe.contentDocument || iframe.contentWindow.document;
var usernameTextBox = innerDoc.getElementById('txtfromdate');
document.getElementById ( "txtHidData" ).value = usernameTextBox.value;
C#
string valueInCodeBehind = txtHidData.Value;

You can not access iframe's content with server side code.
For accessing content of iframe, you should use javascript.
In jquery, you can access it :
var iFrameContent = $('#iframebody').content();
var fromDate = iFrameContent.find('#txtfromdate').val();
var toDate= iFrameContent.find('#txttodate').val();
store it in hidden fields on page, and then access in server side code
Place two hidden fields on your aspx page. like
<asp:HiddenField id="hdffromdate" runat="server"></asp:textbox>
<asp:HiddenField id="hdftodate" runat="server"></asp:textbox>
Set values in these hidden fields like
$('[id$=hdffromdate]').val(fromDate );
$('[id$=hdftodate]').val(toDate);
in your submit button click event handler
protected void submit_Click(object sender, EventArgs e)
{
var fromDate = Convert.ToDateTime(hdffromdate.Value);
var toDate = Convert.ToDateTime(hdftodate.Value);
//...
}

Related

custom ListView inside Update panel not refreshing

I'm trying to solve this problem.
I have an Accordion inside an UpdatePanel. Inside the Accordion control I dinamically create at most four AccordionPanes, each with a custom ListView that shows some image previews fetched from a database. Each preview is composed by a 160x120 ImageButton. When the user clicks on one of these buttons a popup is opened with the image at real size (by a Seadragon control); he can now rotate the image and save it back to the database. Now, after saving the image, I close the popup and submit a postback by generating a click event on a hidden button inside the UpdatePanel containing the Accordion, but even if I can step through the hidden button event code, the refresh doesn't take place. The hidden button was the last (and most effective) solution I've tried, without success. What am I missing ? (The absolute best solution would be refresh the only image that changed, because sometimes the ListView contains several previews).
This is the
<div>
<table class="style8">
<tr>
<td class="style2">
<asp:UpdatePanel ID="usersPanel" runat="server" >
<ContentTemplate>
<cc1:c1treeview ID="tvUsers" runat="server"
onselectednodeschanged="tvUsers_SelectedNodesChanged" AutoPostBack="True"
onnodecheckchanged="tvUsers_SelectedNodesChanged">
</cc1:c1treeview>
</ContentTemplate>
</asp:UpdatePanel>
<asp:UpdatePanel ID="imagesPanel" runat="server" UpdateMode="Always" >
<ContentTemplate>
<asp:Button ID="hiddenImageRefresh" runat="server" Text="Refresh"
style="display:none;" onclick="hiddenImageRefresh_Click" />
<ajaxToolkit:Accordion ID="accImages" runat="server" >
</ajaxToolkit:Accordion>
</ContentTemplate>
</asp:UpdatePanel>
</td>
</tr>
</table>
</div>
And this is the code contained in the hidden button click event, code, that regularly runs when the popup closes. It simply extracts a user code (promo) and rebind the data (LoadImages)
protected void hiddenImageRefresh_Click(object sender, EventArgs e)
{
string promo = "";
if(Session[SessionVariables.CurrentPromoter] != null)
promo = Session[SessionVariables.CurrentPromoter].ToString();
LoadImages(promo, ddlImageType.SelectedValue);
}
Steps to refresh only updated image
Step#1: in JavaScript
//Take one global variable
var selectedImageId="";
Step#2: in JavaScript
//set above var with image id, When user clicks on the ImageButton, which is inside openPopup function
selectedImageId = this.id;
Step#3: in Code-Behind
protected void bSave_Click(object sender, EventArgs e) {
//SaveImage();
#region here get the imageUrl that needs to be updated and send as parameter in closePopup js function
var timeStamp = dImgTag.ToString("yyyyMMdd HH:mm:ss.fff") ;
var promoter = riga["PROMOTER"].ToString();
var pv = riga["PV"].ToString();
var imageUrl = string.Format("../Handlers/ImageLoader.ashx?id={0}&promo={1}&pv={2}", timeStamp, promoter, pv);
#endregion
ClientScriptManager csm = Page.ClientScript;
csm.RegisterStartupScript(Page.GetType(), "closeScript", "closePopup(true,'"+ imageUrl +"');", true);
}
Step#4: in JavaScript
function closePopup(refreshParent, imageUrl) {
if (refreshParent) {
//get the selectedImage and set the source with new url
var selectedImage = window.opener.document.getElementById(selectedImageId);
selectedImage.src = imageUrl;
}
window.close();
}

Where to catch user control properties being wrapped to be loaded inside a modal?

I have a user control which has a public property (e.g. AlarmID) and this control is wrapped inside a div and when user presses a button on the page, in code-behind the public property of that user control becomes set. then a ScriptManager.RegisterStartupScript is called to show a modal popup which is a div wrapping that control.
My problem is that although in code-behind I first set the public property of that user control, but when the modal popup shows that user control, I cannot access that property
I used Control_PreRender, and Control_Load events but none of them were able to show the correct value of that property in a label inside that control.
For more clarification, here is my code in the code-behind of the control:
protected void Control_Load(object sender, EventArgs e)
{
lblAlarmCode.Text = alarmID.ToString();
}
public int AlarmID
{
get
{
return this.alarmID;
}
set
{
this.alarmID = value;
}
}
What is the exact life-cycle event in which I can catch the property to be shown correctly by that label?
Thanks
Make sure that the modal is attached to the <form> element on the page otherwise it will not be a part of the page lifecycle at all.
Just as a sample, not saying this is your code, but I had to use something similar in order to have <asp:Textbox> and <asp:Button> controls to be brought back and forth across the Request
ASPX code:
<asp:Panel runat="server" ID="pnlWorkItem">
<fieldset>
<legend></legend>
<label>Job Code</label>
<asp:DropDownList runat="server" ID="ddlJobCode" Width="50%" />
<label>Hours</label>
<asp:TextBox runat="server" ID="txtHours" />
</fieldset>
<fieldset>
<legend></legend>
<p><asp:Button runat="server" ID="btnAddWorkItem" OnClick="btnAddWorkItem_Click" text="Add Work Item" /></p>
</fieldset>
</asp:Panel>
Javascript:
$(function () {
var workItemPanel = $("#<%= pnlWorkItem.ClientID %>");
workItemPanel.hide();
$("#add-work").on("click", function () {
$(workItemPanel).dialog({
width: 450,
height: 300
}).parent().appendTo($("form:first"));
});
});
It will append your element to the form element generated by ASP.net and should have your properties set and carried across.
One solution is to set the label in setter. However there might be other solutions but this ways is just working.

RadGrid Edit Popup

I have a RadGrid that opens a PopUp window for updating records. In the edit popup I have a combobox where that has on selectedindex changed event. In that event I am trying to set HiddenFields that are on the page of the grid. Meaning that the hidden Fields are not in the same scope of the grid.
page.aspx
<div>
<RadGrid runat="server" ID="GlJournalEntryGrid" Height="300px" Width="1400px"
AutoGenerateColumns="False" OnNeedDataSource="GlJournalEntryGrid_NeedDataSource"
OnItemCommand="GlJournalEntryGrid_ItemCommand"
OnItemDataBound="GlJournalEntryGrid_ItemDataBound">
... Edit PopUp and controls....the comboBox that updates one of the other HF below...
</RadGrid>
</div>
<div id="HiddenFieldsForGlChartLU">
<asp:HiddenField runat="server" ID="jegAccountHF" />
<asp:HiddenField runat="server" ID="jegCompanyHF" />
<asp:HiddenField runat="server" ID="jegDivisionHF" />
<asp:HiddenField runat="server" ID="jegRegionHF" />
<asp:HiddenField runat="server" ID="jegDepartmentHF" />
</div>
code-Behind
protected void jegCompany_ComboBox_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)
{
#region Set HiddenField for control so accessible by javascript
if (cbCompany.SelectedValue != null)
jegCompanyHF.Value = cbCompany.SelectedValue;
else
jegCompanyHF.Value = "";
#endregion Set HiddenField for control so accessible by javascript
...
}
You are triggering a server-side event on the SelectedIndexChanged event. This means your popup is posting the information about the item selected in the combobox to the server. You want the data to be presented in a hidden field in the parent browser window on the client.
In order to update that information on the client, you have two options:
Write some Javascript from the child window to send the data to the
parent window.
In your SelectedIndexChanged event write the data to session and then trigger a refresh of
the parent window to load the data from session

asp:ListBox SelectedValue not setting (dynamically or when clicked)

I have an asp:ListBox that is populated dynamically from js based on the selected value of another asp:List box. The problem is that the second list box always returns a SelectedValue of "" regardless of whether i set lstBox.selectedIndex = 0 or actually select an item in the list.
.js to add to list then set default selected item
var Option = document.createElement("option");
lstId = document.getElementById(lstId);
Option.text = lstItem;
lstId.add(Option);
lstId.selectedIndex = 0;
.vb to get selected value
Dim selSchedule As String = lstCRMSched.SelectedValue
Now as this list is populated by javascript i had to set my #page EnableEventValidation = "false" otherwise the postback that came later would fail.
Side note: I'm noticing that asp.net doesn't like it when you use hidden divs as overlays that are unhidden based on menu selections as everything it does requires a postback, which wipes out the state of the other divs. Should i just have 10 .aspx files one for each div and just switch locations from the codebehind using sessions to transfer things like selected values and data that is to be shown in another div?
You can access the SelectedValue of the drop down list through the Request object since every element in the form that has a name is submitted in the request.
You simply need to do this:
Dim selSchedule As String = Request[lstCRMSched.UniqueID]
Now, this will work just because you disabled EventValidation on the page. The error you were getting is completely normal. ASP.NET is just making sure that no one sends data that wasn't rendered by the server initially to prevent attacks. If you were to keep the EventValidation enabled on the page, you'd need to register the list for Validation via ClientScriptManager.RegisterForEventValidation
If you add items to the dropdownlist on the client these items are not persisted on the server!
But you may try saving dynamically added items (text-value-pairs) within some hidden input fields and parse them out on the server. See this link for a working example. For your example you will also have to save your selectedIndex within another hidden field to be able to access it on the server.
EDIT
demo.aspx
<script type="text/javascript">
function saveValue() {
var hiddenField1 = document.getElementById("hiddenField1");
hiddenField1.value = "hello world";
}
</script>
<form id="Form1" method="post" runat="server">
<input type="hidden" id="hiddenField1" name="hiddenField1" value="" />
<asp:Button ID="btnPostBack" runat="server" Text="PostBack"
OnClientClick="saveValue()" onclick="btnPostBack_Click" />
</form>
demo.aspx.cs
protected void btnPostBack_Click(object sender, EventArgs e)
{
Debug.WriteLine("Value of hiddenField1: " + Request["hiddenField1"]);
Debugger.Break();
}
This one worked for me. I got "hello world" on the server.
EDIT 2
Icarus pointed out that you can always access any submitted element to the server by referring to the Request object and of course he is absolutelly right! According to your question I thought you'd like to have access to all dynamically created items - and that is - with solution shown below - not possible.
aspxPage
<script type="text/javascript">
function saveToList() {
var ListBox1 = document.getElementById("ListBox1");
var ListBox2 = document.getElementById("ListBox2");
var Option = document.createElement("option");
Option.text = ListBox1.options[ListBox1.selectedIndex].text;
ListBox2.add(Option);
ListBox2.selectedIndex = 0;
}
</script>
<form id="Form1" method="post" runat="server">
<asp:ListBox ID="ListBox1" runat="server">
<asp:ListItem Text="entry1" Value="1" />
<asp:ListItem Text="entry2" Value="2" />
<asp:ListItem Text="entry3" Value="3" />
<asp:ListItem Text="entry4" Value="4" />
</asp:ListBox>
<asp:ListBox ID="ListBox2" runat="server" Width="100"></asp:ListBox>
<input id="Button1" type="button" value="Save to List" onclick="saveToList()" />
<asp:Button ID="btnPostBack" runat="server" Text="PostBack" OnClick="btnPostBack_Click" />
codeBehind
protected void btnPostBack_Click(object sender, EventArgs e)
{
Debug.WriteLine("SelectedValue of ListBox2: " + Request["ListBox2"]);
// no access to all other clientSide created items in ListBox2
Debugger.Break();
}

How to display an image in a new window

I have a follow-on question to How to display an image based on SelectedValue in a GridView?
What I would really like to do is have a ViewImage button on my GridView control so that when that is clicked, the image is displayed on a new page in a new browser window. How would I do that? I'm thinking perhaps do I need to create a
<asp:ButtonField>
How do I handle the click and how do I get the image to diplay on a new form in a new web browser window?
Thanks very much for looking.
You can use TemplateColumn, in that TemplateColumn you can define a button where you put javascript function to open new window.
Example:
<asp:TemplateField>
<ItemTemplate>
<input type="button" onclick="javascript:ShowImageInNewPage('PageToShowImage.aspx?tradeId=<%# Eval("TradeId") %>');" />
</ItemTemplate>
</asp:TemplateField>
The "ShowImageInNewPage" function is a custom function you declare to popup/open new window with the selected image url.
In PageToShowImage.aspx, declare an img tag:
<asp:Image ID="imgBlah" runat="server" />
In code behind of PageToShowImage.aspx:
protected void Page_Load(object sender, EventArgs e)
{
// this is querystring from GridView page
if(Request.QueryString["tradeId"] != null)
{
imgBlah.Src = "GetImage.aspx?entityId=" + tradeId + "&entityType=T";
}
else
{
imgBlah.Src = "~/images/no-image.jpg"; // set no image
}
}
HTH
I'm hoping that you're dealing with browser supported image formats. Assuming you are, you don't need a ButtonField. One approach would be to use an <asp:HyperLink> in a TemplateColumn, as Arief suggested.
<asp:TemplateField>
<ItemTemplate>
<asp:HyperLink ID="hyperLink1" runat="server" NavigatUrl="UrlToYourViewImagePage" Text="View Image" />
</ItemTemplate>
</asp:TemplateField>
If you want the image to open in a new window, build a window.open call for each HyperLink's NavigateUrl.

Resources