I have a form with some data inside my .aspx webform
I also have a button. When i click that button, i need to load another, exactly the same form, but without refreshing the site, so i wouldn't loose any data in the previous form.
How can i do this?
<form id="form1" runat="server">
<asp:Label ID="labelOpis" runat="server" Text="Opis izdelka"></asp:Label><br />
<asp:TextBox ID="inputTextArea" class="form-control" runat="server"></asp:TextBox><br />
<span style="color:red"><asp:Label ID="errorOpis" runat="server"></asp:Label></span><br />
<asp:Label ID="labelKolicina" runat="server" Text="Količina"></asp:Label><br />
<asp:TextBox ID="inputKolicina" type="number" class="form-control" runat="server"></asp:TextBox><br />
<button id="btnAddNewProduct" class="form-control">Add new product</button>
UPDATE
.aspx
<script src="Content/jquery-1.12.2.min.js"></script>
<link href="Content/bootstrap.min.css" rel="stylesheet" />
<script src="Content/bootstrap.min.js"></script>
<script src="Content/hideForm.js"></script>
<script src="Content/live-preview.js"></script>
<link rel="stylesheet" href="//code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css">
<link rel="stylesheet" href="//resources/demos/style.css">
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$( function() {
$( "#accordion" ).accordion();
} );
</script>
<script type="text/javascript">
$(document).ready(function () {
$('.ticket').click(function () {
$(".skrijPrvo").slideToggle();
});
});
</script>
<body>
<div class="container-fluid">
<div class="container">
<div class="row">
<div class="col-sm-6 col-sm-offset-3">
<form id="form1" runat="server">
<div class="form-group">
<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder><br />
</div>
<asp:Button ID="Button2" runat="server" class="form-control" Text="Zaključi nakup"/><br />
<asp:Button ID="Button3" runat="server" class="form-control" Text="Nazaj"/><br />
<asp:Button ID="Button4" runat="server" Text="Dodaj nov artikel" class="ticket" OnClick="AddControl_Click" /><br />
</form>
</div>
</div>
</div>
</div>
ascx
<body>
<div id="accordion">
<h3>Dodaj nov izdelek</h3>
<div class="skrijPrvo">
<asp:Label ID="labelOpis" runat="server" Text="Opis izdelka"></asp:Label><br />
<asp:TextBox ID="inputTextArea" class="form-control" runat="server"></asp:TextBox><br />
<span style="color:red"><asp:Label ID="errorOpis" runat="server"></asp:Label></span><br />
<asp:Label ID="labelKolicina" runat="server" Text="Količina"></asp:Label><br />
<asp:TextBox ID="inputKolicina" type="number" class="form-control" runat="server"></asp:TextBox><br />
<span style="color:red"><asp:Label ID="errorKolicina" runat="server"></asp:Label></span><br />
<asp:DropDownList ID="inputDropdownList" class="form-control" runat="server">
<asp:ListItem Text="" Value=""></asp:ListItem>
<asp:ListItem Text="Material1" Value="Material1"></asp:ListItem>
<asp:ListItem Text="Material2" Value="Material2"></asp:ListItem>
<asp:ListItem Text="Material3" Value="Material3"></asp:ListItem>
</asp:DropDownList><br />
<span style="color:red"><asp:Label ID="errorDropDown" runat="server"></asp:Label></span><br />
<asp:FileUpload ID="fileUpload" runat="server" class="form-control" onchange="readURL(this)" /><br />
<span style="color:red"><asp:Label ID="errorFileUpload" runat="server"></asp:Label></span><br />
<asp:Image ID="fileUploadImg" class="form-control" runat="server" Height="300px"/><br />
</div>
</div>
I think you are looking for dynamically added User Controls.
Add a new User Control to your project and put your form in it.
<asp:Label ID="labelOpis" runat="server" Text="Opis izdelka"></asp:Label>
<br />
<asp:TextBox ID="inputTextArea" class="form-control" runat="server"></asp:TextBox>
<br />
<span style="color: red"><asp:Label ID="errorOpis" runat="server"></asp:Label></span>
<br />
<asp:Label ID="labelKolicina" runat="server" Text="Količina"></asp:Label>
<br />
<asp:TextBox ID="inputKolicina" type="number" class="form-control" runat="server"></asp:TextBox>
<br />
<asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
On the page that will contain the Controls you need to add a PlaceHolder
<asp:PlaceHolder ID="PlaceHolder1" runat="server"></asp:PlaceHolder>
<br />
<asp:Button ID="AddControl" runat="server" Text="Button" OnClick="AddControl_Click" />
Then you need to (re)create the User Controls on every Page Load and the Add Control button click.
protected void Page_Load(object sender, EventArgs e)
{
//check if the viewstate exists and if so, build the controls
if (ViewState["controlCount"] != null)
{
addControls(Convert.ToInt32(ViewState["controlCount"]));
}
else
{
//if not add just 1 control
addControls(1);
}
}
private void addControls(int n)
{
//loop the amount of controls and add them to the placeholder
for (int i = 0; i < n; i++)
{
UserControl1 control = (UserControl1)LoadControl("~/UserControl1.ascx");
PlaceHolder1.Controls.Add(control);
}
//save the control count into a viewstate
ViewState["controlCount"] = PlaceHolder1.Controls.Count;
}
protected void AddControl_Click(object sender, EventArgs e)
{
//add an extra control
addControls(1);
}
UPDATE
You can access the values of the TextBoxes by setting a property in the User Control with a getter and a setter.
public string textBox1
{
get
{
return TextBox1.Text;
}
set
{
TextBox1.Text = value;
}
}
protected void Page_Load(object sender, EventArgs e)
{
}
And now you can access them from the Parent by looping all the controls and get the value.
foreach (UserControl1 control in PlaceHolder1.Controls)
{
Label1.Text += control.textBox1 + "<br>";
}
add you code inside
<asp:updatepanel>
tag and add onclick properties to you button. After that you can write your business code in code behind (aspx.cs). This is default ajax in asp.net
Related
I have requiredFieldValidator for a dropdownlist inside a panel. If there is no data selected in the dropdown btnSubmitReport works fine to validate and display *. Once data is selected and btnSubmitReport is clicked to display data it still works fine. Now if you unselect the dropdown and hit btnSubmitReport it does not do validation anymore. This is because first time btnSubmitReport_Click is clicked, it checks to see if Page.IsValid and calls JavaScript code, but subsequent calls are just calling JavaScript code and btnSubmitReport_Click is not being called to see if the page is Valid. Please suggest. Here is the sample code on the aspx page:
<%# Page Language="C#" AutoEventWireup="true" CodeBehind="testValidator.aspx.cs"
MasterPageFile="~/Site.master" Inherits="textXslt.testValidator" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js" type="text/javascript"></script>
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
<script src="Styles/Reports.js" type="text/javascript"></script>
<h3>
<asp:Label ID="lblHeader" runat="server" Text="Reporting Filter"></asp:Label>
</h3>
<div style="text-align: right">
<input id="lnkShowFilter" type="button" value="Show Filter" onclick="ShowF()" class="btn" />
<input id="lnkHideFilter" type="button" value="Hide Filter" onclick="HideF()" class="btn" />
</div>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
<div id="divFilter">
<asp:UpdatePanel ID="uplMain" runat="server">
<ContentTemplate>
<asp:PlaceHolder ID="PlaceHolder1" runat="server">
<table>
<tr>
<td valign="top">
<table>
<tr>
<td>
<asp:CheckBox ID="chkBusiness" runat="server" Text="Business Division" CssClass="chkbox" />
</td>
<td>
<asp:DropDownList ID="ddlBusiness" runat="server" AppendDataBoundItems="true" AutoPostBack="true"
CausesValidation="True" OnSelectedIndexChanged="ddlBusiness_SelectedIndexChanged"
ValidationGroup="grpSubmit" Width="350px">
<asp:ListItem Selected="True" Value="-1">--- SELECT ---</asp:ListItem>
<asp:ListItem>Orange</asp:ListItem>
<asp:ListItem>Apple</asp:ListItem>
<asp:ListItem>Mango</asp:ListItem>
</asp:DropDownList>
</asp:DropDownList>
<asp:RequiredFieldValidator ID="rfvBusiness" runat="server" ControlToValidate="ddlBusiness"
Enabled="true" ToolTip="Please select a Business." ErrorMessage="*" InitialValue="-1"
ForeColor="Red" CssClass="required" Display="Dynamic" ValidationGroup="grpSubmit">
</asp:RequiredFieldValidator>
</td>
</tr>
</table>
</td>
</tr>
</table>
</asp:PlaceHolder>
<hr size="1" />
<div style="text-align: center">
<table style="width: 10%">
<tr>
<td>
<asp:Button ID="btnHome" runat="server" Text="Home" OnClick="btnHome_Click" CssClass="btn" />
</td>
<td>
<asp:Button ID="btnSubmitReport" runat="server" Text="Submit" OnClick="btnSubmitReport_Click"
ValidationGroup="grpSubmit" CssClass="btn" />
</td>
</tr>
</table>
</div>
</ContentTemplate>
</asp:UpdatePanel>
</div>
<div id="divResult">
<asp:UpdatePanel ID="uplGrid" runat="server">
<ContentTemplate>
Here go Results of grid
</ContentTemplate>
</asp:UpdatePanel>
</div>
</asp:Content>
Here is the code behind:
protected void btnSubmitReport_Click(object sender, EventArgs e)
{
if (Page.IsValid)
{
btnSubmitReport.Attributes["onclick"] = "javascript:SubmitF();";
}
//then do rest of the processing to display grid results
}
and here is Reports.js file:
function ShowF() {
$('#lnkShowFilter').hide();
$('#divFilter').show();
$('#lnkHideFilter').show();
$('#divResult').hide();
$('#MainContent_lblHeader').text("Reporting Filter");
}
function HideF() {
$('#lnkShowFilter').show();
$('#divFilter').hide();
$('#lnkHideFilter').hide();
$('#divResult').show();
$('#').show();
$('#MainContent_lblHeader').text("Report Result");
}
function SubmitF() {
// alert("SubmitF");
$('#lnkShowFilter').show();
$('#divFilter').hide();
$('#lnkHideFilter').hide();
$('#divResult').show();
$('#MainContent_lblHeader').text("Report Result");
}
well, I was able to solve the issue by using client-side validation. So I created a function
<script type="text/javascript">
function ValidateAndShowPopup() {
if (Page_ClientValidate('grpSubmit')) {
SubmitF();
}
}
And added both OnclientClick and OnClick to the submit button
<asp:Button ID="btnSubmitReport" runat="server" Text="Submit" OnClick="btnSubmitReport_Click" ValidationGroup="grpSubmit" OnClientClick="ValidateAndShowPopup()" CssClass="btn" />
I have panel in my HTML like this:
<asp:Panel ID="cropPanel" runat="server">
<div class="col-xs-6">
<h3 style="text-align:center; text-decoration:solid;">Before image: </h3>
<img style="width:100%;" id="before" src="" runat="server" />
<asp:HiddenField ID="X1" runat="server" />
<asp:HiddenField ID="Y1" runat="server" />
<asp:HiddenField ID="W1" runat="server" />
<asp:HiddenField ID="H1" runat="server" />
</div>
<!-- After image -->
<div class="col-xs-6">
<h3 style="text-align:center; text-decoration:solid;">After image: </h3>
<img style="width:100%;" id="after" src="" runat="server" />
<asp:HiddenField ID="X2" runat="server" />
<asp:HiddenField ID="Y2" runat="server" />
<asp:HiddenField ID="W2" runat="server" />
<asp:HiddenField ID="H2" runat="server" />
</div>
</asp:Panel>
This is the logic for getting the cropped image new dimensions using jQuery/JavaScript like following:
$('#<%=before.ClientID%>').Jcrop({
onSelect: SelectCropArea
});
function SelectCropArea(c) {
$('#<%=X1.ClientID%>').val(parseInt(c.x1));
$('#<%=Y1.ClientID%>').val(parseInt(c.y1));
$('#<%=W1.ClientID%>').val(parseInt(c.w1));
$('#<%=H1.ClientID%>').val(parseInt(c.h1));
}
$('#<%=after.ClientID%>').Jcrop({
onSelect: SelectCropArea2
});
function SelectCropArea2(c) {
$('#<%=X2.ClientID%>').val(parseInt(c.x2));
$('#<%=Y2.ClientID%>').val(parseInt(c.y2));
$('#<%=W2.ClientID%>').val(parseInt(c.w2));
$('#<%=H2.ClientID%>').val(parseInt(c.h2));
}
And when I press the link button event:
<asp:LinkButton ID="linkCrop" OnClick="linkCrop_Click" runat="server">Save & Upload</asp:LinkButton>
Code behind:
Rectangle CropAreaBefore = new Rectangle(Int32.Parse(X1.Value), Int32.Parse(Y1.Value), Int32.Parse(W1.Value), Int32.Parse(H1.Value));
Rectangle CropAreaAfter = new Rectangle(Int32.Parse(X2.Value), Int32.Parse(Y2.Value), Int32.Parse(W2.Value), Int32.Parse(H2.Value));
//The `X1/Y1/W1/H1 and X2/Y2/W2/H2 are empty
What am I doing wrong here??
Edit: I checked whether the values are set properly in jquery, they are, here's the pic showing it:
Below is my Html Code:
<%# Page Language="C#" AutoEventWireup="true" MasterPageFile="~/Site.Master" CodeBehind="BranchRegistration.aspx.cs" Inherits="BloodBank.BranchRegistration" %>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<div class="settings_pagecontent">
<div class="addform">
<asp:Button ID="BtnAdd" runat="server" CssClass="button" Text="Add" />
<br />
<br />
</div>
<div class="form">
<div class="settings_border-line">
<div class="settings_label_left">
<asp:Label ID="lblbranchname" class="settings_label_inv" runat="server" Text="Branch Name"></asp:Label>
<br />
<br />
<asp:Label ID="lblbranchphonenumber" class="settings_label_inv" runat="server" Text="Phone Number"></asp:Label>
<br />
<br />
</div>
<div class="text_right">
<asp:TextBox ID="txtbranchname" class="settings_textbox_body Branch_txt" runat="server"></asp:TextBox><br />
<br />
<asp:TextBox ID="txtbranchphonenumber" class="settings_textbox_body" runat="server"></asp:TextBox>
<asp:Label ID="lblbranchemailid" class="settings_label_inv" runat="server" Text="Email ID"></asp:Label>
<asp:TextBox ID="txtbranchemailid" class="settings_textbox_body" runat="server"></asp:TextBox>
</div>
<div class="clear"></div>
</div>
<br />
<br />
<div class="border-line">
<div class="label_left" style="width: 150px">
<asp:Label ID="lblbranchaddress" class="settings_label_inv" runat="server" Text="Branch Address"></asp:Label>
<br />
<br />
<asp:Label ID="lblbranchlandmark" class="settings_label_inv" runat="server" Text="Landmark"></asp:Label>
<br />
<br />
<asp:Label ID="lblTehsil" class="settings_label_inv" runat="server" Text="Tehsil"></asp:Label>
<br />
<br />
<asp:Label ID="lblbranchstate" class="settings_label_inv" runat="server" Text="State"></asp:Label>
<br />
<br />
<asp:Label ID="lbllocationmap" class="settings_label_inv" runat="server" Text="Location"></asp:Label>
<br />
<br />
</div>
<div class="text_right" style="width: 670px">
<asp:TextBox ID="txtbranchaddress" class="settings_textbox_body" runat="server"></asp:TextBox>
<asp:Label ID="lblbranchstreet" class="settings_label_inv" runat="server" Text="Street"></asp:Label>
<asp:TextBox ID="txtbranchstreet" class="settings_textbox_body" runat="server"></asp:TextBox>
<br />
<br />
<asp:TextBox ID="txtbranchlandmark" class="settings_textbox_body" runat="server"></asp:TextBox>
<asp:Label ID="lblbranchlocality" class="settings_label_inv" runat="server" Text="Locality"></asp:Label>
<asp:TextBox ID="txtbranchlocality" class="settings_textbox_body" runat="server"></asp:TextBox>
<br />
<br />
<asp:TextBox ID="txttehsil" runat="server" class="settings_textbox_body"></asp:TextBox>
<asp:Label ID="lblDistrict" class="settings_label_inv" runat="server" Text="District"></asp:Label>
<asp:TextBox ID="txtDistrict" runat="server" class="settings_textbox_body"></asp:TextBox>
<br />
<br />
<asp:DropDownList ID="ddlState" runat="server" class="settings_textbox_body"></asp:DropDownList>
<asp:Label ID="lblbranchpincode" class="settings_label_inv" runat="server" Text="Pincode"></asp:Label>
<asp:TextBox ID="txtbranchpincode" class="settings_textbox_body" runat="server"></asp:TextBox>
<br />
<br />
<asp:TextBox ID="txtbranchlocationmap" class="settings_locationmap" runat="server"></asp:TextBox>
<br />
<br />
<asp:Button ID="invSubmit" runat="server" Text="Submit" />
<asp:Button ID="invReset" runat="server" Text="Reset" />
</div>
<div class="clear"></div>
</div>
</div>
<div class="grid">
</div>
</div>
<script type="text/javascript">
$(document).ready(function () {
$('<%=txttehsil.ClientID%>').autocomplete({
source: function (request, response) {
$.ajax(
{
type: "POST",
contentType: "application/json; charset=utf-8",
url: "BranchRegistration.aspx/GetNames",
data: "{'name':'" + $('<%=txttehsil.ClientID%>').val() + "'}",
dataType: "json",
success: function (data) {
response(data.d);
},
error: function (err) {
alert("Error: " + err);
}
});
}, minLength: 1
});
});
</script>
<link href="Content/site1.css" rel="stylesheet" />
<link href="Content/Site.css" rel="stylesheet" />
</asp:Content>
And server side code is as follow:
[System.Web.Services.WebMethod]
public static List<string> GetNames(string name)
{
List<string> nameList = new List<string>();
string strSqlQuery = "Select * from SubRegions where SubRegionName like '%" + name + "%'";
SqlDataAdapter da = new SqlDataAdapter(strSqlQuery, Common.GetConnectionString());
DataSet ds = new DataSet(); da.Fill(ds, "SubRegions");
DataTable dt = ds.Tables["SubRegions"];
DataRowCollection drc = dt.Rows;
foreach (DataRow dr in drc)
{
nameList.Add(dr["SubRegionName"].ToString());
}
return nameList;
}
This code is run without a master page, but it is not run in my application. Please give me proper answer. In this page autocomplete textbox is use.It is jquery ajax application. I use this code in another project its execute properly and gave me proper result.
Add "System.Web.Script.Services.ScriptMethodAttribute()" in your server code, the problem is solved.
your sever code look like this
[System.Web.Services.WebMethod ,System.Web.Script.Services.ScriptMethodAttribute()]
public static List<string> GetNames(string name)
{
List<string> nameList = new List<string>();
string strSqlQuery = "Select * from SubRegions where SubRegionName like '%" + name + "%'";
SqlDataAdapter da = new SqlDataAdapter(strSqlQuery, Common.GetConnectionString());
DataSet ds = new DataSet(); da.Fill(ds, "SubRegions");
DataTable dt = ds.Tables["SubRegions"];
DataRowCollection drc = dt.Rows;
foreach (DataRow dr in drc)
{
nameList.Add(dr["SubRegionName"].ToString());
}
return nameList;
}
I have this code below. I am attempting to on the checkbox click the 2 expanded divs would be shown/hidden. For some reason the functions are being hit but they are not hiding/showing hte divs. I put the exact code in jfiddle and it worked correctly. Any input would be great thanks.
HERE IS JFIDDLE THAT WORKS CORRECTLY http://jsfiddle.net/svmY3/3/
<%# Control Language="C#" AutoEventWireup="true" CodeBehind="HorizontalSinglePageOptinSqueezePage2.ascx.cs" Inherits="UmbracoUsercontrols.HorizontalSinglePageOptinSqueezePage2" %>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js">
</script>
<script type="text/javascript">
$(document).ready(function () {
alert('test234123123');
$("#assist").change(function () {
$("#expanded, #expanded2").toggle();
alert('test2343');
});
});
function showhide() {
alert('test');
$("#expanded, #expanded2").toggle();
}
</script>
<!-- BASIC FORM -->
<div class="col-md-4">
<form role="form">
<div class="form-group">
<Asp:TextBox runat="server" class="form-control" type="text" id="name" placeholder="NAME"/>
</div>
<div class="form-group">
<Asp:TextBox runat="server" class="form-control" type="email" id="email" placeholder="EMAIL"/>
</div>
<div class="assistance">I would like immediate assistance: <input type="checkbox" runat="server" id="assist" onclick="showhide();" /></div>
<!-- EXPANDED FORM SECTION 1 -->
<div style="display:none" runat="server" class="expanded" id="expanded">
<div class="form-group">
<asp:textbox runat="server" type="tel" class="form-control" id="phone" placeholder="PHONE"/>
</div>
<p class="center">Please tell us about your situation and we'll see if we can help. We will also email you the <em>The 5 Easiest Ways to STOP Foreclosure in Under 48 Hours or Less</em>.</p>
</div>
<!-- END EXPANDED FORM SECTION 1 -->
</form></div>
<div class="col-md-5">
<!-- EXPANDED FORM SECTION 2 -->
<div runat="server" style="display:none" class="expanded" id="expanded2">
<div class="form-group">
<asp:label runat="server">Are you most interested in:</asp:label>
<asp:dropdownlist runat="server" id="interest" class="pull-right">
<asp:listitem value="Selling" Text="Selling"></asp:listitem>
<asp:listitem value="Refinancing" Text="Refinancing">
</asp:listitem>
<asp:listitem value="Keeping" Text="Keeping"></asp:listitem>
</asp:dropdownlist>
</div>
<div class="form-group">
<Asp:Label runat="server" >Are you in foreclosure:</Asp:Label>
<asp:DropDownList runat="server" ID="foreclosure" OnChange="javascript:toggle();">
<asp:ListItem Value="Yes" Text="Yes" />
<asp:ListItem Selected="True" Value="No" Text="No" />
</asp:DropDownList>
</div>
<div class="form-group">
<asp:label runat="server">Your best guess, how much do you owe on:</asp:label><br />
<asp:label runat="server" >1st Mortgage:</asp:label>
<asp:textbox runat="server" type="text" class="form-control" placeholder="Amount"/>
</div>
<div class="form-group">
<label>2nd Mortgage:</label>
<asp:textbox runat="server" type="text" class="form-control" placeholder="Amount"/>
</div>
<div class="form-group">
<asp:label runat="server" >Have you filed bankruptcy:</asp:label>
<asp:dropdownlist runat="server" ID="bankruptcy" class="pull-right">
<asp:listitem value="No" Text="No"></asp:listitem>
<asp:listitem value="Yes" Text="Yes"></asp:listitem>
</asp:dropdownlist>
</div>
<div class="form-group">
<asp:label runat="server" >Please describe your situation (briefly):</asp:label><br />
<asp:textbox runat="server" ID="situation" class="form-control"></asp:textbox>
</div>
</div>
<!-- END EXPANDED FORM SECTION -->
<asp:button runat="server" id="button" name="button" type="submit" text="Get Your E-Book Now" class="btn btn-primary btn-lg trackMe" data-trackerid="optin" OnClick="submitButton_Click"></asp:button>
<div class="center privacy">
<small>100% Privacy Guaranteed</small>
</div>
</div>
When an ASP control has runat="server", it generates a new id for the element so that it can bind its own JS handler to that new generated id. I bet if you inspect that element on the browser, its id won't be assist. Remove runat="server" if you aren't actually doing a server callback.
Put showhide() inside the $(document).ready function. Otherwise you're assigning the toggle-effect before the according input element is even loaded.
$(document).ready(function () {
$("#assist").change(function () {
$("#expanded, #expanded2").toggle();
});
function showhide() {
$("#expanded, #expanded2").toggle();
}
});
Hello everyone iam trying to open a aspx page in a dialog box window from asp button click event but even after specifying the dialog height and dialog width i want i could see dialog window opening in a default size.It seems like the height and width parameters i am passing are ignored.
Here is the Server Side Code:
ScriptManager.RegisterClientScriptBlock(this.Page, this.Page.GetType(),Guid.NewGuid().ToString(), "try { showMessageRulesDialog('MessageRuleCenterFrame.htm', true); }catch(e){alert(e);}", true);
JavaScript Code:
function showMessageRulesDialog(dialogName, refresh)
{
try {
var WinSettings = "wcenter:yes;resizable:no;onscroll:off;dialogHeight:700px;dialogWidth:610px;";
var ret = window.showModalDialog("../Dialogs/" + dialogName,"", WinSettings);
if (refresh) {
window.location = window.location;
}
}
catch (e)
{ alert("ShowDialog Error: " + e); }
}
HtmPage Properties
<iframe src="MessageRulesCenter.aspx" style="height:700px;width:610px;" frameborder="0" scrolling="yes"></iframe>
MessageRulesCenter.aspx
<%# Page Language="C#" AutoEventWireup="true" CodeFile="MessageRulesCenter.aspx.cs" Inherits="Dialogs_QuotaCenter" %>
<!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">
<%--<base target="_blank" /> --%>
<title>Quota Message Center</title>
<link rel="Stylesheet" href="../Skins/QuotaCenter.css" />
<script language="javascript" type="text/javascript" src="../Scripts/Common.js"></script>
<style type="text/css">
#form1
{
height: 450px;
width: 581px;
}
.formfield * {
vertical-align: middle;
border-width:0px;
}
</style>
</head>
<body style="text-align: left">
<form id="form1" runat="server">
<table style="height: 437px; width: 582px" >
<tr>
<td bgcolor="#91ACFF">
<div class="Section" id="Sec1">
<div>
<br />
<asp:Label ID="Label1" runat="server" Text="Message Rule Name : "
ForeColor="Black" Font-Bold="False"></asp:Label>
<asp:TextBox ID="txtRuleName" runat="server"></asp:TextBox>
<br /><br />
</div>
<div>
<asp:Label ID="Label2" runat="server" ForeColor="Black"
Text="Create Message Rule On :" Font-Bold="False"></asp:Label>
<br />
<br />
</div>
</div>
<div class="Section" id="Sec2">
<div>
<asp:RadioButton ID="rdoIncoming" GroupName="MessageRules" runat="server" ForeColor="Black"
Text="Incoming Message" AutoPostBack="True"
oncheckedchanged="rdoOutgoing_CheckedChanged" />
<asp:RadioButton ID="rdoOutgoing" GroupName="MessageRules" runat="server" ForeColor="Black"
Text="Outgoing Message" oncheckedchanged="rdoOutgoing_CheckedChanged"
AutoPostBack="True" />
<br />
<br />
</div>
<div>
<asp:Label ID="Label3" runat="server" ForeColor="Black" Text="Where"></asp:Label>
<br />
</div>
<div>
<p class="formfield">
<asp:Label ID="lblField1" runat="server" ForeColor="Black" Text="From field Contains :"></asp:Label>
<asp:TextBox ID="txtField3" runat="server" Width="272px" TextMode="MultiLine"></asp:TextBox>
<asp:Button ID="btnAddContact" runat="server" Text="Add Contact" Width="102px" onclick="btnAddContact_Click"/>
<br />
</p>
</div>
<div>
<p class="formfield">
<asp:Label ID="lblFiled2" runat="server" ForeColor="Black" Text="Subject Contains :"></asp:Label>
<asp:TextBox ID="txtField4" runat="server" Width="270px"></asp:TextBox>
<br />
</p>
</div>
</div>
<div class="Section" id ="Sec3">
<div>
<asp:Label ID="Label4" runat="server" ForeColor="Black" Text="Then"></asp:Label>
</div>
<div>
<p class="formfield">
<asp:RadioButton ID="rdoMove" runat="server" GroupName ="ActionType" ForeColor="Black" Text="Move it to the Folder : " />
<asp:DropDownList ID="ddlMove" runat="server" Width="165px" onselectedindexchanged="ddlMove_SelectedIndexChanged" >
</asp:DropDownList>
</p>
</div>
<div>
<p class="formfield">
<asp:RadioButton ID="rdoCopy" runat="server" GroupName ="ActionType" ForeColor="Black" Text="Copy it to the Folder : " />
<asp:DropDownList ID="ddlCopy" runat="server" Width="165px" onselectedindexchanged="ddlMove_SelectedIndexChanged" >
</asp:DropDownList>
</p>
</div>
<div style="text-align:right">
<asp:Label ID="lblError" runat="server"></asp:Label>
<p class="formfield">
<asp:Button ID="btnDone" runat="server" Text="Done" OnClick="btnDone_Click" Width="61px" />
<asp:Button ID="Button2" runat="server" OnClick="Button2_Click" Text="Cancel" />
</p>
</div>
</div>
</td>
</tr>
</table>
</form>
I tried your code and it seems it works fine. My guess for why it is not working as expected could be because of the browser version.
Check if you get the required behavior if you remove the Doctype declaration (the top most line in the page).