In my ASP.Net app, I have a button that launches a modal. The onClick event fires the C# behind code that launches a modal. I am then calling a data table and populating string variables with values from the data table:
protected void uxTicketHistoryButton_Click(object sender, EventArgs e)
{
ClientScript.RegisterStartupScript(this.GetType(), "key", "launchModal();", true);
DataTable ticketHist = _dtMgr.GetContactInfoByName(uxContactDropdownList.SelectedValue);
string rName = ticketHist.Rows[0]["RequestorName"].ToString();
string rPhone = ticketHist.Rows[0]["RequestorPhone"].ToString();
string rPhoneExt = ticketHist.Rows[0]["RequestorPhoneExt"].ToString();
string rEmail = ticketHist.Rows[0]["RequestorEmail"].ToString(); ;
string rState = ticketHist.Rows[0]["RequestorState"].ToString();
string rOrg = ticketHist.Rows[0]["RequestorOrg"].ToString();
}
What I want to do now is add those variable values to my modal inside the panel.
<asp:Button ID="uxTicketHistoryButton" runat="server" Text="Show Ticket History" style="color: blue;" OnClick="uxTicketHistoryButton_Click"/>
<!-- ModalPopupExtender-->
<ajaxToolkit:ModalPopupExtender ID="uxTicketHistoryModal" runat="server" PopupControlID="Panel1" TargetControlID="uxTicketHistoryButton"CancelControlID="btnClose" BackgroundCssClass="modalBackground">
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" align="center" style = "display:none">
**** Add variable values here ****
<asp:Button ID="btnClose" runat="server" Text="Close" />
</asp:Panel>
How do I add the variables from my .cs file to the modal panel in my .aspx file so that it shows up like this (values in the { } )?
UPDATE
This issue seems to be related to the modal interfering with the _Click event function of my button. I have posted an additional question to resolve this problem first. Then, I believe one of the solutions below may work. Thanks everybody!
Webform:
<asp:Panel ID="Panel1" runat="server" CssClass="modalPopup" align="center" style = "display:none">
Name: <asp:Literal ID="Name" runat="server" /><br>
Organization: <asp:Literal ID="Organization" runat="server" /><br>
etc....
<asp:Button ID="btnClose" runat="server" Text="Close" />
</asp:Panel>
Codebehind:
Name.Text = ticketHist.Rows[0]["RequestorName"].ToString();
Organization.Text = ticketHist.Rows[0]["RequestorOrg"].ToString()
You can use ASP.NET Razor to post your c# variables directly into your html.
For Example
<!-- Single statement block -->
#{ var myMessage = "Hello World"; }
<!-- Inline expression or variable -->
<p>The value of myMessage is: #myMessage</p>
<!-- Multi-statement block -->
#{
var greeting = "Welcome to our site!";
var weekDay = DateTime.Now.DayOfWeek;
var greetingMessage = greeting + " Here in Huston it is: " + weekDay;
}
<p>The greeting is: #greetingMessage</p>
OR
you could use get and set methods to post your variables to the modal from you .cs .
public class yourModalPage
{
public string RequestorName { get; set; }
}
Then you can send values to your modal from your .cs with
yourModalPage.RequestorName = "RequestorName";
Related
I hava a MasterPage with 2 UserControls. When something happens in UserControl1.ascx, it has to update a TextBox in UserControl2.ascx.
I tried this inside UserControl1.ascx, but no success:
UserControl userControl = (UserControl)LoadControl("UserControl2.ascx");
var txt = (TextBox) userControl.FindControl("txtTest");
txt.Text = "Hello world";
Thanks for all help :)
The LoadControl is load a new control that is not exist on page...
Lets see this example.
You have a master page that has 2 User Controls.
<form id="form1" runat="server">
<div>
<uc1:WebUserControl ID="WebUserControl1" runat="server" />
<br /><br />
<uc2:WebUserControl ID="WebUserControl2" runat="server" />
<br /><br />
<asp:Button runat="server" ID="btnOk" Text="ok" OnClick="btnOk_Click" />
</div>
</form>
and on code behind this
protected void btnOk_Click(object sender, EventArgs e)
{
WebUserControl1.TextOnMe = WebUserControl2.TextOnMe;
}
Now the user controls have this on html
<asp:TextBox runat="server" ID="txtText"></asp:TextBox>
and on code behind you get and set the Text like that on code behind
public string TextOnMe
{
get
{
return txtText.Text;
}
set
{
txtText.Text = value;
}
}
One Similar Answer
ASP.NET MasterPage only control?
I want to do a task in which i want that using findControl during the use of webusercontrol on web form to get value of webusercontrol on main page I mean, I've created a webusercontrol and have used on web form. In webusercontrol.ascx page i use a textbox, calendar, and dropdownlist. Now I want to get value(which i choose from txtbox, ddl etc) should be display on main page. I mean, I want to use a button on default.aspx page and in a variable want to store value of txtbox, calendar etc. and using a FindControl want to get these values on main page. How I can do this plz help me by code plz I'm new in programing.
This is the code of ascx page
<%# Control Language="C#" ClassName="CalendarUserControl" %>
<asp:TextBox ID="txtData" runat="server"></asp:TextBox> <br />
<asp:Calendar ID="Calendar1" runat="server" BackColor="Beige" >
</asp:Calendar>
<br/>
<asp:DropDownList ID="ddlthings" runat="server">
<asp:ListItem> Apple</asp:ListItem>
<asp:ListItem> Banana</asp:ListItem>
<asp:ListItem> Mango</asp:ListItem>
<asp:ListItem> Grapes</asp:ListItem>
</asp:DropDownList>
default.aspx page
<div>
<uc1:CalendarUserControl ID="CalendarUserControl1" runat="server" />
<br />
<asp:Button ID="Button1" runat="server" OnClick="btn_Click" Text="Button" />
<br />
<asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
</div>
Define properties in your user control, that will return values of controls you want. For example
public partial class CalendarUserControl: UserControl
{
// this is code-behind of your user control
public string Data
{
get {return txtData.Text;}
}
public DateTime CalendarDate
{
get {return Calendar1.SelectedDate;}
}
// same approach for drop down list ddlthings
}
Then in your aspx page, just read those values, for example in your btn_Click event handler
protected void btn_Click(object sender, EventArgs e)
{
var textBoxValue = CalendarUserControl1.Data;
var calendarValue = CalendarUserControl1.CalendarDate;
//....
}
i did it, just write these lines in default.cs
protected void btn_Click(object sender, EventArgs e)
{
TextBox myLabel = (TextBox)CalendarUserControl1.FindControl("txtData");
string x = myLabel.Text.ToString();
Calendar c = (Calendar)CalendarUserControl1.FindControl("Calendar1");
string date = c.SelectedDate.ToString();
DropDownList b = (DropDownList)CalendarUserControl1.FindControl("ddlthings");
string ddl = b.SelectedValue;
Label1.Text = "Your text is: " + x + "<br />"+ " Your Selected Date is: " + date + "<br />"+ " Your Selected Item is: " + ddl;
}
Recently I have been developing web form application in ASP.NET (c#):
I have an Image control:
<asp:Image ID="Avatar" runat="server" Height="225px" ImageUrl="~/Images/NoUser.jpg" Width="225px" />
And FileUpload & Button control
<asp:FileUpload ID="avatarUpload" runat="server" />
<asp:Button ID="btnUpload" runat="server" Text="Upload" OnClick="Upload" />
When user click button then "Upload" code is executed (the image is sent to the database). Problem is that I like to display the image which the user selected in Avatar Image controller before the user clicks "desperate" button.
Is that possible to do this automatically?
With the help of File Api of HTML5 (Example: Using files from web applications) you can accomplish this easily. Change the markup to use input type="file" instead of asp:FileUpload and add ID, add tag runat="server" to make it accessible from server. Your markup should look like:
<input ID="avatarUpload" type="file" name="file" onchange="previewFile()" runat="server" />
<%--<asp:FileUpload ID="avatarUpload" runat="server" />--%>
<asp:Button ID="btnUpload" runat="server" Text="Upload" OnClick="Upload" />
<asp:Image ID="Avatar" runat="server" Height="225px" ImageUrl="~/Images/NoUser.jpg" Width="225px" />
Now add a javascript function previewFile in the head of document:
<head runat="server">
<title></title>
<script type="text/javascript">
function previewFile() {
var preview = document.querySelector('#<%=Avatar.ClientID %>');
var file = document.querySelector('#<%=avatarUpload.ClientID %>').files[0];
var reader = new FileReader();
reader.onloadend = function () {
preview.src = reader.result;
}
if (file) {
reader.readAsDataURL(file);
} else {
preview.src = "";
}
}
</script>
</head>
Now after selecting an image you can see the preview like below:
You can use css to re-size it to a thumbnail.
After clicking the Upload button, in the code you can find the posted file:
protected void Upload(object sender, EventArgs e)
{
int contentLength = avatarUpload.PostedFile.ContentLength;//You may need it for validation
string contentType = avatarUpload.PostedFile.ContentType;//You may need it for validation
string fileName = avatarUpload.PostedFile.FileName;
avatarUpload.PostedFile.SaveAs(#"c:\test.tmp");//Or code to save in the DataBase.
}
I have a couple of textboxes on my page and want to fill them with data from the database. I do the query and get (in my case) a Film object back wich i use to fill textboxes but it won't work.
Here is my code:
private void FilmInfo(int gekozenFilm)
{
BLFilm blFilm = new BLFilm();
Film film = blFilm.GetFilmById(gekozenFilm);
TextBoxFilm.Text = film.Naam;
TextBoxRelease.Text = film.Releasedatum.ToString();
TextBoxTrailer.Text = film.Filmpje;
TextBoxAfbeelding.Text = film.Afbeelding;
}
There is a Film object in film but for some reason the textboxes don't display the text.
Code (that is relevant) for the entire page:
protected void ListBoxMovies_SelectedIndexChanged(object sender, EventArgs e)
{
int gekozenFilm;
gekozenFilm = Convert.ToInt32(ListBoxMovies.SelectedItem.Value);
FilmInfo(gekozenFilm);
}
private void FilmInfo(int gekozenFilm)
{
BLFilm blFilm = new BLFilm();
Film film = blFilm.GetFilmById(gekozenFilm);
TextBoxFilm.Text = film.Naam;
TextBoxRelease.Text = film.Releasedatum.ToString();
TextBoxTrailer.Text = film.Filmpje;
TextBoxAfbeelding.Text = film.Afbeelding;
}
The .aspx page
<form id="form1" runat="server">
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
<section id="context">
<article id="left">
<h2>Movie CRUD</h2>
<div class="seperator">
<!-- seperator -->
<asp:Label ID="LabelNaam" runat="server" Text="Naam"></asp:Label>
<asp:TextBox ID="TextBoxFilm" runat="server" Width="250px"></asp:TextBox>
<br />
<asp:Label ID="LabelRelease" runat="server" Text="Releasedatum"></asp:Label>
<asp:TextBox ID="TextBoxRelease" runat="server" Width="185px"></asp:TextBox>
<br />
<asp:Label ID="LabelTrailer" runat="server" Text="Trailer"></asp:Label>
<asp:TextBox ID="TextBoxTrailer" runat="server" Width="241px"></asp:TextBox>
<br />
<asp:Label ID="Label1" runat="server" Text="Afbeelding"></asp:Label>
<asp:TextBox ID="TextBoxAfbeelding" runat="server" Width="209px"></asp:TextBox>
</div>
</article>
<article id="right">
<h2>Movies</h2>
<asp:ListBox ID="ListBoxMovies" runat="server" Height="141px" Width="315px" OnSelectedIndexChanged="ListBoxMovies_SelectedIndexChanged" ViewStateMode="Inherit" AutoPostBack="True"></asp:ListBox>
</article>
</section>
</form>
I've tried putting breakpoint pretty much everywhere and textboxes have a value for text but on the page it remains empty?
It'll be a good idea to check if your updatetemplate contains the Textboxes you want to fill.
Why don't you use a Recordset?
It is very easy to use and I think is good for your situation:
Here more info
I have a form that calls some javascript and some code behind (C# for me) when a link button is pressed. Normal operation should act as such: Click on link button which gets text from a label on the form, opens an HTML editor, save the text by clicking 'Done' on the text editor and then displaying the text on the form again. It will do all of that, but I get an error (control is undefined) and then that prevents me from doing any other work on the form.
First, here is my aspx code, which is a window that hold the HTML editor, and the HTML editor.
<asp:Panel ID="EditCommentPopup" runat="server" SkinID="PopupPanel" HorizontalAlign="Center" Width="500px" Style="display:none;">
<div id="SendCommentHeader" class="modalPopupHeader">
<table width="100%" style="vertical-align: middle">
<tr>
<td style="width: 50%; text-align: left; padding-left: 5px;">
<asp:Label ID="EditCommentHeaderLBL" runat="server" Font-Bold="true" Text="Change Comment" ></asp:Label>
</td>
<td style="width: 50%; text-align: right; padding-right: 3px;">
<asp:Button SkinID="SubmitButton" ID="SaveComment" runat="server" Text="Done" OnClientClick="submitEditorPopup(); return true;" OnClick="SubmitCommentButton_Click"/>
<asp:Button SkinID="CancelButton" ID="cancelCommentButton" runat="server" Text="Cancel"/>
</td>
</tr>
</table>
</div>
<ajaxToolkit:ModalPopupExtender ID="EditCommentPopupExtender" runat="server" TargetControlID="EditCommentHeaderLBL"
PopupControlID="EditCommentPopup" BackgroundCssClass="modalBackground" PopupDragHandleControlID="EditCommentPopup"
DropShadow="False" CancelControlID="cancelCommentButton" BehaviorID="ChangeCommentsPopup" >
</ajaxToolkit:ModalPopupExtender>
<asp:Panel ID="EditCommentInnerPanel" SkinID="PopupInnerPanel" HorizontalAlign="Center" runat="server" >
<asp:Label ID="CommandArgLBL" runat="server" Visible="false"></asp:Label>
<custom:CustomTextEditor ID="EditCommentsTextBox" runat="server" Width="100%" Height="300px" NoScript="true" />
</asp:Panel>
</asp:Panel>
Here are my javascript functions
var contentLBL;
var editorControl;
var hiddenField;
function LoadEditorPopup(labelID, editorID, hiddenID, linkID) {
editorControl = document.getElementById(editorID);
contentLBL = document.getElementById(labelID);
hiddenField = document.getElementById(hiddenID);
editorControl.control.set_content(contentLBL.innerHTML);
var popup = $find("ChangeCommentsPopup");
popup.show();
}
function submitEditorPopup() {
var tmp = editorControl.control.get_content(); //error flags here
contentLBL.innerHTML = tmp;
var str= new String();
str = tmp;
str = str.replace(/</g, "{%");
str = str.replace(/>/g, "%}"); //stripping out html tags to prevent sql insertion
hiddenField.value = str;
var popup = $find("ChangeCommentsPopup");
popup.hide();
}
And here are my C# functions
protected void ShowEditCommentPopup(object sender, EventArgs e)
{
string arg = ((LinkButton)sender).CommandArgument;
string content = "";
string title = "";
switch (arg)
{
//doing stuff, setting content and title
}
EditCommentHeaderLBL.Text = title;
CommandArgLBL.Text = arg;
EditCommentsTextBox.Content = content;
EditCommentPopupExtender.Show();
EditModalPopupExtender.Show(); //this is the form
}
So, what's happening here, I click on a linkbutton (not shown in aspx code) and it fires the LoadEditorPopup function in the javascript. It does its stuff and I have a 'return true' in the onclientclick call so that the next function, ShowEditCommentPopup, in the code behind, will be called. The editor pops up and I can use it just fine. When I click 'Done' the SubmitEditorPopup event is fired in the javascript and I get an error saying that the variable EditorControl is undefined. I have found that if I do not call the ShowEditCommentPopup method, the error does not occur, but then I get back to another problem I had originally, which I'm hoping that will be fixed if this problem is fixed.
I really hope that was clear enough. Thanks in advance!
You have a snippet with your javascript functions. Where does that code live? It it inside a class or function that could be getting called a second time? If so, var editorControl; could be getting run again and override your previous editorControl variable. I would put an alert right about var editorControl; to make sure.
alert( 'Should only happen once' );
var editorControl;
Since that didn't help, I guess you could try replacing
var tmp = editorControl.control.get_content();
with
tmp = document.getElementById(editorID);
in submitEditorPopup.