How to execute javascript pageload event on multi instance web user control - c#

I'm developing an web user control for that i need to set some properties at page load (client side page load). My control works fine with one instance on page.
But when i need multiple instance of that control on same page.Page load event shows effects only on last control.
My control
<%# Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControlLoadTest.ascx.cs" Inherits="WebUserControlLoadTest" ClientIDMode="Predictable" %>
<link rel="stylesheet" href="GridViewCSSThemes/YahooGridView.css" type="text/css" media="screen" />
<script runat="server" type="text/C#">
static Int16 _count;
public static Int16 count
{
get { return _count++; }
}
</script>
<script type="text/javascript">
function pageLoad() {
document.getElementById('<%= Hidden_RowIndex.ClientID%>').value = '<%= count%>';
document.getElementById('<%= txtUC.ClientID%>').value = "Count : " + document.getElementById('<%= Hidden_RowIndex.ClientID%>').value;
}
</script>
<asp:HiddenField ID="Hidden_RowIndex" Value="" runat="server" />
<asp:TextBox ID="txtUC" CssClass="tb10" Enabled="false" runat="server"></asp:TextBox>
Use control on aspx page
<%# Page Language="C#" AutoEventWireup="true" CodeFile="ContextMenuTest.aspx.cs" Inherits="ContextMenuTest" %>
<%# Register Assembly="AjaxControlToolkit" Namespace="AjaxControlToolkit" TagPrefix="cc1" %>
<%# Register TagPrefix="uc1" TagName="UCTest" Src="~/WebUserControlLoadTest.ascx" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Java Script Load Test</title>
</head>
<body>
<form id="form1" runat="server">
<ajaxToolkit:ToolkitScriptManager runat="server" ID="ScriptManager1" EnablePageMethods="true" />
<table style="padding:1%;width:100%;">
<tr>
<td>
<uc1:UCTest runat="server" ID="UCTest1"/>
</td>
</tr>
<tr>
<td>
<uc1:UCTest runat="server" ID="UCTest2"/>
</td>
</tr>
</table>
</form>
</body>
After execution result will be Count - 0 in first Control and Count - 1 in Second.
But it shows 1 Control blank and second with Control -1 text.
Can any one tell me how can i make different instance of java-script page-load event in multi instance web user control.

The problem is
static Int16 _count;
public static Int16 count
{
get { return _count++; }
}
If you declare your control multiple times, then you override the counter each time the control is rendered.
You need a smarter Javascript, for examle, add a class on the control wrapper inside WebUserControlLoadTest.ascx something like
<div class="myControl">
<asp:HiddenField ID="Hidden_RowIndex" Value="" runat="server" />
<asp:TextBox ID="txtUC" CssClass="tb10" Enabled="false" runat="server">
</asp:TextBox>
</div>
and at the top of the aspx page you can have this:
$(document).ready(function(){
var count = 0;
$("myControl input:hidden").each(function(){$(this).value = count++});
});

Related

C# - Data from ___.aspx to ___.cshtml with a form

I'm new to C# - ASP.NET and I'm trying to drop data ,from a filled form, from .aspx to .cshtml.
I made a form with three TextBoxes and a Button, a method for the "onClick". This method set the value of ViewData (name,date,user) with the values of the three TextBoxes. And I want to collect these value on the page targeted by the form.
I do not get any error but ViewData(name,date,user) seems to be empty.
Here's my code :
CSHTML
#{
ViewBag.Title = "Consulter";
}
#Html.Partial("MenuBar")
#Html.Partial("Connexion")
#ViewData["name"]
<style type="text/css">
...
</style>
...
<h2>...
ASPX
<%# Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>
<script language="C#" runat="server">
public void Ajouter(Object sender, EventArgs e)
{
ViewData["name"] = dateForm.Text;
ViewData["date"] = dateForm.Text;
ViewData["user"] = userForm.Text;
}
</script>
<!DOCTYPE html>
<html>
<head id="Head1" runat="server">
<meta name="viewport" content="width=device-width" />
<title>AjouterForm</title>
</head>
<body>
<h1>Ajouter un produit</h1>
<div>
<form id="form1" runat="server" action="Consulter" defaultbutton="bouton1" method="get">
<div>
<asp:TextBox placeholder="Name" runat="server" ID="nameForm"/></br>
<asp:TextBox placeholder="Date" runat="server" ID="dateForm"/></br>
<asp:TextBox placeholder="User" runat="server" ID="userForm"/></br>
<asp:Button runat="server" text="Envoyer" ID="bouton1" onClick="Ajouter"/>
<asp:Label runat="server" ID="label1" />
</div>
</form>
</div>
</body>
</html>
If you know how to solve it or if you have another way to do it, it would be amazing :)
Thank you in advance.

this.Master.Page.FindControl("iwMenuMain") returns null. Why?

I have login form (iwFormLogin), based on master page, which contains ASPxMenu menu with id "iwMenuMain". Why does this.Master.Page.FindControl("iwMenuMain") returns null?
C# method:
private void iwUpdateMenu()
{
ASPxMenu menuMain = null;
try
{
menuMain = this.Master.Page.FindControl(iwConstants.iwFrmRoot.iwMenuMainID) as ASPxMenu;
// menuMain is null after upper statement. Why?!
this.iwDataSourceMenus.SelectParameters.Clear();
this.iwDataSourceMenus.SelectParameters.Add(#"cUserId",
this.iwTextBoxUsername.Text.ToString());
this.iwDataSourceMenus.SelectParameters.Add(#"cProgramId",
this.iwComboBoxAvailablePrograms.SelectedItem.Value.ToString());
this.iwDataSourceMenus.SelectParameters.Add(#"bDebug",
"1");
DataView dv = (DataView)this.iwDataSourceMenus.Select(DataSourceSelectArguments.Empty);
if((menuMain != null) || (dv != null))
{
menuMain.DataSource = dv;
menuMain.DataBind();
}
}
catch(Exception ex)
{
menuMain.Visible = false;
} // try
And here is Master page menu declaration:
<%# Master Language="C#" AutoEventWireup="true" CodeBehind="Root.master.cs" Inherits="iwDashboard.Root" %>
<%# Register assembly="DevExpress.Web.v13.2, Version=13.2.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.Web.ASPxEditors" tagprefix="dx" %>
<%# Register assembly="DevExpress.Web.v13.2, Version=13.2.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.Web.ASPxCallbackPanel" tagprefix="dx" %>
<%# Register assembly="DevExpress.Web.v13.2, Version=13.2.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.Web.ASPxPanel" tagprefix="dx" %>
<%# Register assembly="DevExpress.Web.v13.2, Version=13.2.7.0, Culture=neutral, PublicKeyToken=b88d1754d700e49a" namespace="DevExpress.Web.ASPxMenu" tagprefix="dx" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>
</title>
<link rel="stylesheet" type="text/css" href="~/Styles/Site.css" />
<asp:ContentPlaceHolder
ID="head"
runat="server">
</asp:ContentPlaceHolder>
</head>
<body>
<form
id="FormMain"
runat="server">
<div class="headerContainer" >
<table
style="width:100%;text-align:right;">
<tr>
<td style="text-align:right;">
<dx:ASPxLabel
ID="iwLabelThemes"
runat="server"
ForeColor="White"
AssociatedControlID="iwLabelThemes"
Text="Themes:">
</dx:ASPxLabel>
</td>
<td style="width:150px;text-align:left;">
<dx:ASPxComboBox
ID="iwComboBoxThemes"
Theme="Moderno"
runat="server"
AssociatedControlID="iwComboBoxThemes" AutoPostBack="True">
<ClientSideEvents SelectedIndexChanged="function(s, e)
{
ASPxClientUtils.SetCookie("wiThemeSelected",
s.GetValue());
}"/>
</dx:ASPxComboBox>
</td>
</tr>
</table>
</div>
<div
class="menuContainer">
<div class="content-wrapper">
<dx:ASPxMenu
ID="iwMenuMain"
runat="server"
CssClass="mainMenu"
VerticalAlign="Middle"
Visible="false">
</dx:ASPxMenu>
</div>
</div>
<div>
<asp:ContentPlaceHolder
ID="iwContentPlaceholderMain"
runat="server">
</asp:ContentPlaceHolder>
</div>
</form>
</body>
</html>
If you are accessing a control that is declared directly under the master page, do the following instead...
this.Master.FindControl("iwMenuMain")
You do NOT need to do a fully-recursive search to find this control given the control hierarchy you have defined in your master page. You would, if it were nested within another control
You are looking in the Page but it's in the Master, so replace
this.Master.Page.FindControl
with
this.Master.FindControl
You can also Achieve your task By doing Following thing
Control div = this.Page.Master.FindControl("iwMenuMain");

I get a "Microsoft JScript runtime error: Object doesn't support this property or method" error for anything with autopostback=true on one of my pages

I have a .NET application with the following aspx code:
<%# Page Language="C#" AutoEventWireup="True" CodeBehind="Default.aspx.cs" Inherits="WebApplication1.Default"%>
<%# Register TagPrefix="asp" Namespace="AjaxControlToolkit" Assembly="AjaxControlToolkit"%>
<%# Register assembly="Telerik.Web.UI" namespace="Telerik.Web.UI" tagprefix="telerik"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<body>
<form id="form1" runat="server">
<asp:ToolkitScriptManager ID="ScriptManager1" runat="server" EnablePartialRendering="true">
</asp:ToolkitScriptManager>
<table>
<tr>
<td>
<asp:RadioButtonList ID="rblTest" runat="server" AutoPostBack="True"
onselectedindexchanged="rblTest_SelectedIndexChanged">
<asp:ListItem Text="1" Value="1"></asp:ListItem>
<asp:ListItem Text="2" Value="2"></asp:ListItem>
</asp:RadioButtonList>
</td>
<td>
<asp:PlaceHolder ID="ph1" runat="server" Visible="False">
Some text
</asp:PlaceHolder>
</td>
</tr>
</table>
</form>
</body>
</html>
I then have a C# method as follows:
protected void rblTest_SelectedIndexChanged(object sender, EventArgs e)
{
if (rblTest.SelectedValue == "2")
ph1.Visible = true;
else
ph1.Visible = false;
}
Below is where the crash occurred. It crashes any time I use a control that has autopostback=true. I use the same syntax on about 15 other forms and those all work just fine. Am I missing a property somewhere or is there something wrong with my method? I originally had an UpdatePanel around the controls and I plan on adding it again, but I need to get the postback working first.
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['Default'];
if (!theForm) {
theForm = document.Default;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit(); <-----Crashed at this line.
}
}
//]]>
</script>
What am I missing or is there some common mistake that I may have made somewhere? Thanks in advance for your help.
Your __doPostBack script is trying to submit a form with id "Default" (see document.forms["Default"] line; yet your markup shows a form with id "form1" so it's clear why it doesn't work: the __doPostBack function is not finding the form and calling theForm.submit() fails.
You can attempt to fix it by renaming the form to use the id "Default" since I don't think you can control the way the __doPostBack script is generated.

How can I make JavaScript run in WebBrowser control?

In my winforms aplication I have a WebBrowser control named webBrowser1.
In code all I added is navigating to a page:
private void Form1_Load(object sender, EventArgs e)
{
webBrowser1.Navigate("http://localhost:6489/Default.aspx");
}
The code for the page to which I navigate is:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="TableRowShow.Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
window.onload = function()
{
document.getElementById('addDestination').setAttribute('onclick', 'addDest();');
}
function attach()
{
document.getElementById('addDestination').setAttribute('onclick', 'addDest();');
}
var i = 1; // position of next tr to be shown
function addDest()
{
var trs = document.getElementById('travelTable').getElementsByTagName('tr');
if (trs[i] != null)
trs[i++].style.display = "";
}
</script>
</head>
<body>
<form id="form1" runat="server">
<table id="travelTable">
<tr>
<td>
<asp:TextBox runat="server" />
</td>
</tr>
<tr style="display: none">
<td>
<asp:TextBox runat="server" />
</td>
</tr>
<tr style="display: none">
<td>
<asp:TextBox runat="server" />
</td>
</tr>
</table>
<asp:HyperLink runat="server" ID="addDestination"
ClientIDMode="Static" NavigateUrl="javascript:;" >
Add Destination
</asp:HyperLink>
</form>
</body>
</html>
Seen in a browser like IE or Chrome the page looks like this:
Clicking on Add Destination anchor creates a new input:
The problem that I'm having with WebBrowser control is that it loads the page but the JavaScript doesn't work.
If I click on Add Destination nothing happens, even though the same page works well in Chrome or IE.
Placing a breakpoint and using:
webBrowser1.Document.InvokeScript("addDestination");
inside the Immediate window and then continuing to run the program activates the JavaScript in that function adding a new input.
Thanks for replies!
Try attaching the click handlers like this instead of using setAttribute in the onload and attach functions:
document.getElementById('addDestination').onclick = addDest;
You could try setting the ScriptErrorsSuppressed property to false to see whether any JavaScript errors occur.

access master page user control from child page

I have a master page which contains a usercontrol.
Now Abc.aspx is the child page of that master page.Now, child page has also a user control.
My requirement is to grab master page's user control form child page's user control.
Master Page aspx
<%# Master Language="C#" MasterPageFile="~/masterhome.Master" AutoEventWireup="true" CodeBehind="lmsmasternew.master.cs" Inherits="e2aPortal.LMS.lmsmasternew" %>
<%# Register Src="~/homeUserControl/UserProfilePic.ascx" TagPrefix="uc1" TagName="UserProfilePic" %>
<%# Register Src="~/homeUserControl/MuduleListLeftPanel.ascx" TagPrefix="uc1" TagName="MuduleListLeftPanel" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
<title></title>
<script src='<%# ResolveUrl("~/Scripts/jquery-1.4.1-vsdoc.js") %>' type="text/javascript"></script>
<script src='<%# ResolveUrl("~/Scripts/jquery-1.11.1.min.js") %>'></script>
<link href='<%# ResolveUrl("~/StyleSheet/profilesidebar.css") %>' rel="stylesheet" />
<link href='<%# ResolveUrl("~/StyleSheet/font-awesome.css") %>' rel="stylesheet" />
<link href='<%# ResolveUrl("~/Content/bootstrap.min.css") %>' rel="stylesheet" />
<script type="text/javascript">
function openpage(pagename) {
$("#maincontent").load(pagename + ".aspx #maincontent", function () {
// make content visible with effect
});
}
</script>
<asp:ContentPlaceHolder ID="head" runat="server">
</asp:ContentPlaceHolder>
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<div class="form-group">
<div class="row" style="margin-top: 5%;">
<div class="col-xs-3">
<uc1:UserProfilePic runat="server" ID="UserProfilePic" />
<asp:Label runat="server" ID="lbl1"></asp:Label>
<br />
<uc1:MuduleListLeftPanel runat="server" ID="MuduleListLeftPanel" />
</div>
<div class="col-xs-9">
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
</div>
</div>
</div>
</asp:Content>
User control aspx (Used in Master page)
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="MuduleListLeftPanel.ascx.cs" Inherits="e2aPortal.homeUserControl.MuduleListLeftPanel" %>
Now child page that inherits that master page
<%# Page Title="" Language="C#" MasterPageFile="~/LMS/lmsmasternew.master" AutoEventWireup="true" CodeBehind="CreateQuestionTemplate.aspx.cs" Inherits="e2aPortal.LMS.CreateQuestionTemplate" %>
<%# Register Src="~/LMS/UserControl/CreateTemplate.ascx" TagPrefix="uc1" TagName="CreateTemplate" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
<uc1:CreateTemplate runat="server" ID="CreateTemplate" />
</asp:Content>
Now child page's user control
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="CreateTemplate.ascx.cs" Inherits="e2aPortal.LMS.UserControl.CreateTemplate" %>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/jquery-ui.js" type="text/javascript"></script>
<link href="http://ajax.aspnetcdn.com/ajax/jquery.ui/1.8.9/themes/start/jquery-ui.css" rel="stylesheet" type="text/css" />
Now child page's user control codebehind
protected void Page_Load(object sender, EventArgs e)
{
MuduleListLeftPanel control = Page.Master.FindControl("MuduleListLeftPanel") as MuduleListLeftPanel;
//Label control1 = Page.Master.FindControl("lbl1") as Label;
if (control != null)
{
control.Visible = false; // will not going to execute :D
}
}
My requirement is to hide MasterPage's usercontrol for this specific page.
Update:
Got my solution. Thanks for This Post
Problem facing
MuduleListLeftPanel muduleListLeftPanel = this.Master.LeftPanel;
UserProfilePic userProfile = this.Master.UserProfile;
muduleListLeftPanel.Visible = false; // hide sucessfully
userProfile.Attributes["style"] = "display:none"; // non working .. I need to use display none.. for both user control
First, use FindControl on the Master Page to locate the User Control (with ID UserControlOnMaster). So somewhere in the User Control located on a Page, use this code.
WebUserControl1 control = Page.Master.FindControl("UserControlOnMaster") as WebUserControl1;
When found you can then access the other Controls in that User Control.
Label LabelOnMaster = control.FindControl("Label1") as Label;
LabelOnMaster.Text = "Control found!";
Since the UserControl is protected in the parent you need to have a public function to update the control and access it from the child.
Example, in the master page:
public partial class SiteMaster : System.Web.UI.MasterPage
{
public void SetMyUserControlVisibility(bool visible)
{
MyUserControl.Visible= visible;
}
}
Now simply in the child page:
public partial class MyPage : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
if (!IsPostBack)
{
SiteMaster masterPage = (SiteMaster)this.Page.Master;
// update master page's user control here
masterPage.SetMyUserControlVisibility(true);
}
}
}

Categories

Resources