i am making a project in which i am stuck on the selected index changed event of ajax tool kit combo box. what i wanted is that when i select the student name in combobox(studentname) i get the values of other columns from a database into the textboxes with out using any button...i have done it in c# windows form but can't done it in asp.net.
my code is `
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Configuration;
namespace Final_Project
{
public partial class Teacher_Mangement_page : System.Web.UI.Page
{
SqlConnection con = new SqlConnection();
string teachername;
protected void Page_Load(object sender, EventArgs e)
{
con.ConnectionString = ConfigurationManager.ConnectionStrings["studentdatastring"].ConnectionString;
teachername = "teacher1";//Session["name"].ToString();
if (!IsPostBack)
{
cb();
MultiView1.ActiveViewIndex = 0;
}
}
private void cb()
{
ComboBox1.Items.Clear();
ComboBox2.Items.Clear();
con.Open();
SqlCommand cmd = new SqlCommand();
cmd.Connection = con;
cmd.CommandText = "select studentname,subject from academictable where teachername='"+teachername+"'";
SqlDataReader dr = cmd.ExecuteReader();
while (dr.Read())
{
ComboBox1.Items.Add(dr["studentname"].ToString());
ComboBox2.Items.Add(dr["subject"].ToString());
}
con.Close();
}
protected void ComboBox1_SelectedIndexChanged(object sender, EventArgs e)
{
con.Open();
SqlCommand cmd = new SqlCommand();
cmd.Connection = con;
cmd.CommandText = "select * from academictable where studentname='" + ComboBox1.Text + "' and subject='"+ComboBox2.Text+"' ";
SqlDataReader rd = cmd.ExecuteReader();
while (rd.Read())
{
qt1.Text = rd["quiz1"].ToString();
qt2.Text = rd["quiz2"].ToString();
qt3.Text = rd["quiz3"].ToString();
qt4.Text = rd["quiz4"].ToString();
ast1.Text = rd["assignment1"].ToString();
ast2.Text = rd["assignment2"].ToString();
prot.Text = rd["project"].ToString();
mt.Text = rd["mid"].ToString();
ft.Text = rd["final"].ToString();
}
rd.Close();
con.Close();
}
string subject;
protected void Button3_Click(object sender, EventArgs e)
{
MultiView1.ActiveViewIndex = 1;
subject = ComboBox2.Text;
}
protected void Button5_Click(object sender, EventArgs e)
{
MultiView1.ActiveViewIndex = 0;
}
}
}`
and my html code is `
<!DOCTYPE html>
<html>
<head runat="server">
<title>Bootstrap demo</title>
<link href="bootstrap/bootstrap.css" rel="stylesheet" type="text/css" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, intial-scale=1" />
<style type="text/css">
.style3
{
text-align: center;
}
.style5
{
width: 582px;
text-align: right;
}
.style6
{
text-align: center;
}
.style7
{
width: 468px;
text-align: right;
}
h1
{ color:Aqua;
font-style:italic;
font-family:Broadway;
}
h2
{ color:Highlight;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<center><h1>STUDENT PORTAL</h1></center>
<asp:MultiView ID="MultiView1" runat="server">
<asp:View ID="select_subject" runat="server">
<table class="w-100">
<tr>
<td class="style6" colspan="2">
<h2>SUBJECT SELECTION</h2></td>
</tr>
<tr>
<td class="style7">
<h4>Subject:</h4></td>
<td>
<ajaxToolkit:ComboBox ID="ComboBox2" runat="server"
AutoCompleteMode="SuggestAppend" Width="300px">
</ajaxToolkit:ComboBox>
</td>
</tr>
<tr>
<td class="style6" colspan="2">
<asp:Button ID="Button2" runat="server" Text="Show Attendance" Width="162px" />
<ajaxToolkit:RoundedCornersExtender ID="Button2_RoundedCornersExtender"
runat="server" BehaviorID="Button2_RoundedCornersExtender"
TargetControlID="Button2" />
<asp:Button ID="Button3" runat="server" Text="Show Academic Details"
Width="178px" onclick="Button3_Click" /><ajaxToolkit:RoundedCornersExtender ID="RoundedCornersExtender1"
runat="server" TargetControlID="Button3"/>
</td>
</tr>
</table>
</asp:View>
<asp:View ID="Academic_details" runat="server">
<table class="w-100">
<tr>
<td class="text-center" colspan="2">
<h2>ACADEMIC DETAILS</h2></td>
</tr>
<tr>
<td class="style5">
Student Name:</td>
<td>
<ajaxToolkit:ComboBox ID="ComboBox1" runat="server"
AutoCompleteMode="SuggestAppend"
Width="300px" AutoPostBack="True">
</ajaxToolkit:ComboBox>
</td>
</tr>
<tr>
<td class="style5">
Quiz 1 Marks:</td>
<td>
<asp:TextBox ID="qt1" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Quiz 2 Marks:</td>
<td>
<asp:TextBox ID="qt2" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Quiz 3 Marks:</td>
<td>
<asp:TextBox ID="qt3" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Quiz 4 Marks:</td>
<td>
<asp:TextBox ID="qt4" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Assignment 1 Marks:</td>
<td>
<asp:TextBox ID="ast1" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Assignment 2 Marks:</td>
<td>
<asp:TextBox ID="ast2" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Presentation/Project Marks:</td>
<td>
<asp:TextBox ID="prot" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Sessional Marks:</td>
<td>
<asp:TextBox ID="sest" runat="server" ReadOnly="True" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Mid-Term Marks:</td>
<td>
<asp:TextBox ID="mt" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Final-Term Marks:</td>
<td>
<asp:TextBox ID="ft" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
<em style="font-weight: bold; font-style: normal; color: rgb(106, 106, 106); font-family: arial, sans-serif; font-size: small; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;">
Grade Point Average</em><span
style="color: rgb(84, 84, 84); font-family: arial, sans-serif; font-size: small; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;"><span> </span>(</span><wbr
style="color: rgb(84, 84, 84); font-family: arial, sans-serif; font-size: small; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;"><em
style="font-weight: bold; font-style: normal; color: rgb(106, 106, 106); font-family: arial, sans-serif; font-size: small; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;">GPA</em><span
style="color: rgb(84, 84, 84); font-family: arial, sans-serif; font-size: small; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">)<span> :</span></span></wbr>
</td>
<td>
<asp:TextBox ID="gpat" runat="server" ReadOnly="True" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style3" colspan="2">
<asp:Button ID="Button4" runat="server" Text="Button" Width="162px" />
<ajaxToolkit:RoundedCornersExtender ID="Button4_RoundedCornersExtender"
runat="server" BehaviorID="Button1_RoundedCornersExtender"
TargetControlID="Button4" />
<asp:Button ID="Button5" runat="server" Text="Back" Width="162px"
onclick="Button5_Click" />
<ajaxToolkit:RoundedCornersExtender ID="Button5_RoundedCornersExtender"
runat="server" BehaviorID="Button5_RoundedCornersExtender"
TargetControlID="Button5" />
</td>
</tr>
</table>
</asp:View>
</asp:MultiView>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</form>
</body>
`
Related
I tried looking for similar questions but couldn't find any. My aspx file looks something like this
<div align="center" style="height: 350px; overflow-y: scroll; overflow-x: scroll; width: 100%;">
<asp:Table ID="tblReport" Font-Size="11px" runat="server" ViewStateMode="Enabled">
<asp:TableHeaderRow Height="30px" ForeColor="#FFFFFF" BackColor="#3b3b3b" Style="font-weight: bold; text-align: left !important; padding-left: 3px; color: #FFF; border-right: 1px solid #ddeaf7;" HorizontalAlign="Center">
</asp:TableHeaderRow>
</asp:Table>
</div>
Now whenever there are too many columns, the width gets fixed to 100% even though I don't have a max-width property. And the text in the cell ends up in multiple lines. I want it to horizontally overflow out of the div instead.
Edit: Looks like adding this ended up fixing it.
td {
white-space: nowrap;
}
Simple html snippet to demonstrate -
div {
width: 10%;
overflow: auto;
}
<div>
<table>
<tr>
<th>A</th>
<th>B</th>
<th>C</th>
<th>D</th>
<th>E</th>
<th>F</th>
<th>G</th>
<th>H</th>
<th>I</th>
</tr>
<tr>
<td>1</td>
<td>2</td>
<td>3</td>
<td>1</td>
<td>2</td>
<td>3</td>
<td>1</td>
<td>2</td>
<td>3</td>
</tr>
<tr>
<td>4</td>
<td>5</td>
<td>6</td>
<td>4</td>
<td>5</td>
<td>6</td>
<td>4</td>
<td>5</td>
<td>6</td>
</tr>
</table>
</div>
EDIT -
Your updated code would look like -
<div align="center" style="height: 350px; overflow: auto; width: 100%;">
<asp:Table ID="tblReport" Font-Size="11px" runat="server" ViewStateMode="Enabled">
<asp:TableHeaderRow Height="30px" ForeColor="#FFFFFF" BackColor="#3b3b3b" Style="font-weight: bold; text-align: left !important; padding-left: 3px; color: #FFF; border-right: 1px solid #ddeaf7;" HorizontalAlign="Center">
</asp:TableHeaderRow>
</asp:Table>
</div>
I have a string (HTML) being posted to server side and then it is validated using HTMLAgility pack. In the HTML there is an unclosed colgroup tag.
After sanitizing, the closing colgroup tag appears but right between closing "tbody" and "table" tag
BEFORE:
<table width="3265" class="mce-item-table" style="width: 2452pt; border-collapse: collapse;" border="0" cellspacing="0" cellpadding="0">
<colgroup><col width="80" style="width: 60pt;">
<col width="245" style="width: 184pt;" span="13"> <!-- MISSING COLGROUP tag-->
<tbody><tr height="20" style="height: 15pt;">
<td width="80" height="20" style="width: 60pt; height: 15pt; color: blue; text-decoration: underline; text-underline-style: single;"><span style="color: blue;">31109173</span></td>
<td width="245" style="width: 184pt; font-family: Arial; font-size: 9pt;">31109173</td>
<td width="245" align="right" style="width: 184pt; font-family: Arial; font-size: 9pt;">May 09,2017 9:54 AM</td>
<td width="245" align="right" style="width: 184pt; font-family: Arial; font-size: 9pt;">May 08,2017 5:21 PM</td>
</tr>
<tr height="20" style="height: 15pt;">
<td height="20" style="height: 15pt; color: blue; text-decoration: underline; text-underline-style: single;"><span style="color: blue;">30933775</span></td>
<td style="font-family: Arial; font-size: 9pt;">30933775</td>
<td align="right" style="font-family: Arial; font-size: 9pt;">May 09,2017 9:50 AM</td>
<td align="right" style="font-family: Arial; font-size: 9pt;">Apr 28,2017 6:22 PM</td>
</tr>
</tbody></table>
AFTER:
<table width="3265" class="mce-item-table" style="width: 2452pt; border-collapse: collapse;" border="0" cellspacing="0" cellpadding="0">
<colgroup><col width="80" style="width: 60pt;">
<col width="245" style="width: 184pt;" span="13">
<tbody><tr height="20" style="height: 15pt;">
<td width="80" height="20" style="width: 60pt; height: 15pt; color: blue; text-decoration: underline; text-underline-style: single;"><span style="color: blue;">31109173</span></td>
<td width="245" style="width: 184pt; font-family: Arial; font-size: 9pt;">31109173</td>
<td width="245" align="right" style="width: 184pt; font-family: Arial; font-size: 9pt;">May 09,2017 9:54 AM</td>
<td width="245" align="right" style="width: 184pt; font-family: Arial; font-size: 9pt;">May 08,2017 5:21 PM</td>
</tr>
<tr height="20" style="height: 15pt;">
<td height="20" style="height: 15pt; color: blue; text-decoration: underline; text-underline-style: single;"><span style="color: blue;">30933775</span></td>
<td style="font-family: Arial; font-size: 9pt;">30933775</td>
<td align="right" style="font-family: Arial; font-size: 9pt;">May 09,2017 9:50 AM</td>
<td align="right" style="font-family: Arial; font-size: 9pt;">Apr 28,2017 6:22 PM</td>
</tr>
</tbody></colgroup></table>
<!-- ^^ </colgroup> has appeared above-->
I tried setting "OptionFixNestedTags" flag to true. I still get the same result.
I tried various options from HTMLAgility pack and setting them true. This didn't work.
OptionFixNestedTags = true;
OptionAutoCloseOnEnd = true;
There is a nice Nuget package which sanitizes the html. The problem which I faced was tackled here -> HtmlSanitizer
Hope this helps.
A HTML file is generated by Android MobileBiz Pro invoice app. I'm trying to make software for print HTML based invoice via receipt printer
I need to save necessary information of HTML file to string variable as mentioned below. I tried using IndexOf method. but it's not working for me. How can I get this information using visual c#?
string subtotal = 2,976.00;
string total = 2,976.00;
string payment= 2,760.00;
string balance= 216.00;
This is an example of the HTML code:
<tr><td align="right" colspan="3">Subtotal</td><td align="right">2,976.00</td></tr><tr><td align="right" colspan="3"><b>TOTAL</b></td><td align="right"><b>2,976.00</b></td></tr><tr><td align="right" colspan="3">Less Payment</td><td align="right">2,760.00</td></tr><tr class="total"><td align="right" colspan="3"><strong>Balance Due</strong></td><td align="right">216.00</td></tr>
This is a complete HTML code of HTML file
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
body {
font-family:Verdana, Geneva, sans-serif;
font-size: 8pt;
padding: 0 50pt 0 50pt;
}
table td, table th, table.sales th, table td.footer-text {
font-size: 8pt;
}
h1 {
font-family:Verdana, Geneva, sans-serif;
padding-bottom:2px;
margin-bottom:2px;
color:chocolate;
text-transform:uppercase;
font-size: inherit;
font-size: 1.5em;
}
h2 {
font-family:Verdana, Geneva, sans-serif;
padding-bottom:0px;
margin-bottom:0px;
color:chocolate;
text-transform:uppercase;
font-size: 1.3em;
}
h3 {
font-family:Verdana, Geneva, sans-serif;
padding-bottom:2px;
margin-bottom:2px;
}
table.sales td {
padding: 4px 10px 4px 10px;
}
table.sales th {
padding: 5px 10px 5px 10px;
background-color:#CCC;
}
tr.saleline td {
border-bottom-color:chocolate;
border-bottom-width: 1pt;
border-bottom-style: solid;
vertical-align: top;
}
.signature {
display: none;
}
.horizontal-line {
border: 0;
height: 4pt;
color:chocolate;
background-color: chocolate;
}
.total {
font-weight:bold;
font-size:1.1em;
background-color:#CCC;
}
.block1 {
text-align:left;
vertical-align:bottom
}
.block2 {
text-align:right;
vertical-align:bottom
}
.block3 {
text-align:left;
vertical-align:top;
}
.block4 {
text-align:left;
vertical-align:top;
}
.block5 {
text-align:right;
vertical-align:bottom;
}
.block6 {
text-align:left;
vertical-align:top;
margin-top: 15px;
}
.block7 {
text-align:left;
vertical-align:top;
margin-top: 15px;
}
.block8 {
text-align:left;
vertical-align:bottom;
}
.block9 {
text-align:center;
vertical-align:bottom;
}
.block10 {
text-align:right;
vertical-align:bottom;
}
.block11 {
text-align:left;
padding: 25px 0 15px 0;
}
.extracols {
border-style:solid;
border-color:gray;
}
table.extracols {
border-top-width: 1pt;
border-right-width: 0;
border-bottom-width: 1pt;
border-left-width: 1pt;
border-collapse:collapse;
margin: 0 0 15pt 0;
}
table.extracols th {
padding: 5px 10px 5px 10px;
border-top-width: 0;
border-right-width: 1pt;
border-bottom-width: 0;
border-left-width: 0;
border-color:gray;
border-style:solid;
background-color:#CCC;
}
table.extracols td {
padding: 4px 10px 4px 10px;
border-top-width: 0;
border-right-width: 1pt;
border-bottom-width: 0;
border-left-width: 0;
border-color:gray;
border-style:solid;
background-color:#FFF;
}
#footer {
margin-top: 35px;
}
.footer-text {
font-size: inherit;
font-size: 0.97em
}
</style>
</head>
<body style="padding: 20 20 20 20">
<table width="100%">
<tr>
<td style="padding-bottom:20px"><table width="100%">
<tr>
<td style="text-align:left;"></td>
<td class="block2" align="right"><h3>Y.P.Brothers</h3>
No:55/B,<br/>Samagipura,<br/>Sewanagala.
<br/>077-6977139
<br/>mecduino#gmail.com
<br/>
</td>
</tr>
</table></td>
</tr>
<tr>
<td><hr class="horizontal-line"/></td>
</tr>
<tr>
<td><table width="100%">
<tr>
<td style="padding:10px 0 20px 0;"><table width="100%">
<tr>
<td width="33%" class="block3"><strong>Bill To</strong><br />
ANUSHA SURIYA<br/>
</td>
<td class="block4"><strong></strong><br />
</td>
<td class="block5" align="right"><h1>invoice #1</h1>
<b>Date</b>: Oct 9, 2015
<br/><b>Due Date</b>: Oct 9, 2015
</td>
</tr>
</table></td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td><table width="100%" class="sales">
<!-- Headers -->
<tr>
<th align="center">Qty</th> <th align="center">Item</th> <th align="right">Price</th> <th align="right">Amount</th>
</tr>
<!-- Rows -->
<tr class="saleline"> <td align="left">12</td> <td align="left">helaligth 35/=</td> <td align="right">35.00</td> <td align="right">420.00</td> </tr>
<tr class="saleline"> <td align="left">12</td> <td align="left">200p CR SR 195/=</td> <td align="right">195.00</td> <td align="right">2,340.00</td> </tr>
<tr class="saleline"> <td align="left">36</td> <td align="left">Sunlight 35g</td> <td align="right">6.00</td> <td align="right">216.00</td> </tr>
<!-- Totals -->
<tr><td align="right" colspan="3">Subtotal</td><td align="right">2,976.00</td></tr><tr><td align="right" colspan="3"><b>TOTAL</b></td><td align="right"><b>2,976.00</b></td></tr><tr><td align="right" colspan="3">Less Payment</td><td align="right">2,760.00</td></tr><tr class="total"><td align="right" colspan="3"><strong>Balance Due</strong></td><td align="right">216.00</td></tr>
</table></td>
</tr>
</table></td>
</tr>
<tr>
<td><table width="100%" style="margin-top:30px">
<tr>
<td width="50%" class="block6"><h2></h2>
</td>
<td width="50%" class="block7" align="right"><h2></h2>
</td>
</tr>
</table></td>
</tr>
<tr>
<td><table class="block11" width="100%">
<tr>
<td><table></table></td>
</tr>
</table></td>
</tr>
<tr>
<td></td>
</tr>
</table>
<div class="signature">
<table border="0" cellspacing="2" cellpadding="2" align="left">
<tr>
<td style="padding-bottom:30px"></td>
</tr>
<tr>
<td><b>Signed by:</b>
<br/><b>Date:</b>
<br/><b>Signature:</b><br/></td>
</tr>
</table>
</div>
<div id="footer">
<table width="100%" border="0" cellpadding="2">
<tr>
<td align="center"><span class="footer-text">Thank you for your business.</span></td>
</tr>
</table>
</div>
</body>
</html>
You need an html parser, try this one http://htmlagilitypack.codeplex.com/
Load page into HtmlDocument
HtmlWeb htmlWeb = new HtmlWeb();
HtmlDocument htmlDocument = htmlWeb.Load("url");
Get table with specified Id
HtmlNode table = htmlDocument.DocumentNode.Descendants("table").SingleOrDefault(x => x.Id == "tableId");
Loop through nodes to find values
foreach(HtmlNode child in table.ChildNodes)
{
if (child.NodeType != HtmlNodeType.Text)
{
Console.WriteLine(child.Name);
}
}
More you can check here http://www.codeproject.com/Articles/691119/Html-Agility-Pack-Massive-information-extraction-f
You have to use parseHTML function of jquery and then loop through each element to get the values. Below is the working example (It can be more refined as per your need)
$(document).ready(function () {
var str = '<tr><td align="right" colspan="3">Subtotal</td><td align="right">2,976.00</td></tr><tr><td align="right" colspan="3"><b>TOTAL</b></td><td align="right"><b>2,976.00</b></td></tr><tr><td align="right" colspan="3">Less Payment</td><td align="right">2,760.00</td></tr><tr class="total"><td align="right" colspan="3"><strong>Balance Due</strong></td><td align="right">216.00</td></tr>';
var html = $.parseHTML(str);
$.each(html, function (index, element) {
if ($(this).find("td:first").html() == "Subtotal")
console.log($(this).find("td:last").html());
else if ($(this).find("td:first b").html() == "TOTAL")
console.log($(this).find("td:last b").html());
else if ($(this).find("td:first").html() == "Less Payment")
console.log($(this).find("td:last").html());
else if ($(this).find("td:first strong").html() == "Balance Due")
console.log($(this).find("td:last").html());
});
});
aspx code
<asp:ModalPopupExtender ID="MPE" runat="server" BackgroundCssClass="modalBackground"
PopupControlID="pnlGame" CancelControlID="imgCloseBtn" TargetControlID="btnHidden">
</asp:ModalPopupExtender>
<asp:Button runat="server" ID="btnHidden" Style="display: none" />
<asp:Panel ID="pnlGame" runat="Server" CssClass="pnl">
<div class="MsgPopup">
<%--<fieldset class="">--%>
<table style="height: 100%; width: 100%;">
<tr>
<td colspan="2" style="padding-top: 5px; padding-left: 4px;">
<table border="0" class="" style="width: 500px;">
<tr>
<td align="center">
<img src="../img/exclaimationIcon.jpg" width="65px" height="56px" alt="" />
</td>
</tr>
<tr>
<td align="center">
<div id="GameName" style="font-size: medium; width: 500px; font-size: 17px; font-weight: bold;
font-family: Arial; color: Black; font-variant: normal">
Please select the Child, From and To Dates
</div>
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td align="center">
<asp:ImageButton ID="imgCloseBtn" runat="server" Height="38px" ImageUrl="~/img/okButton.jpg"
Width="91px" ToolTip="Close" CausesValidation="False" />
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</asp:Panel>
cs code:
ScriptManager.RegisterStartupScript(Page, this.GetType(), "TestInitPageScript031",
string.Format("<script type=\"text/javascript\">ShowReport();</script>"), false);
Javascript Code:
<script type="text/javascript">
function ShowReport() {
var Asgn1 = document.getElementById("<%=ddlAssignments.ClientID%>").value;
var Assn1 = document.getElementById("<%=ddlAssessment.ClientID%>").value;
var Asgn2 = document.getElementById("<%=ddlAssignments1.ClientID%>").value;
var Assn2 = document.getElementById("<%=ddlAssessment1.ClientID%>").value;
alert(Asgn1);
if (Asgn1 == 0)
{
$find('<%= MPE.ClientID %>').show();
return false;
}
}
</script>
Here is my brief code.Problem is my modal pop up is not displaying. I can trace by alret in alert i am getting 0; but modal pop up not displaying. Can anyone help me to resolve?
asp:ModalPopupExtender is a Server control.
If you want to show it you ave to post a server side Show() event; client side (javascript I mean) won't work.
If you need to work client side, using jQuery, you don't need a server side control: an hidden div set at the top of the window will be enough for you.
HTML
<div class="outerframe">
<div class="innerframe" >
...
CSS
.outerframe {
background: url('../Images/site-bg2.png');
width: 100%;
height: 100%;
position:absolute;
display:block;
text-align: center;
top: 0px;
left: 0px;
z-index: 1000;
}
.innerframe {
position: relative;
margin-left: auto;
margin-right: auto;
width: 100%;
max-width: 1200px;
text-align: left;
overflow: auto;
background: #ffffff; /* Fills the page */
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#eeeeee'); /* for IE */
background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#eeeeee)); /* for webkit browsers */
background: -moz-linear-gradient(top, #ffffff, #eeeeee); /* for firefox 3.6+ */
}
Set BehaviorID for modal popup extender..
<asp:ModalPopupExtender ID="MPE" runat="server" BackgroundCssClass="modalBackground"
PopupControlID="pnlGame" CancelControlID="imgCloseBtn" BehaviorID="PopUp"TargetControlID="btnHidden">
</asp:ModalPopupExtender>
Javascript:
<script type="text/javascript">
function ShowReport() {
var Asgn1 = document.getElementById("<%=ddlAssignments.ClientID%>").value;
var Assn1 = document.getElementById("<%=ddlAssessment.ClientID%>").value;
var Asgn2 = document.getElementById("<%=ddlAssignments1.ClientID%>").value;
var Assn2 = document.getElementById("<%=ddlAssessment1.ClientID%>").value;
alert(Asgn1);
if (Asgn1 == 0)
{
$find("<%=ModalPopupExtender1.BehaviorID%>").show();
return false;
}
}
</script>
Refer this for extra reading..
I am using the following HTML page to make an accordion control:
<!DOCTYPE >
<html >
<head >
<title></title>
<script language="JavaScript" type="text/javascript" >
function Show() {
document.getElementById("tdfirst").style.display = 'block';
}
function Hide() {
document.getElementById("tdfirst").style.display = 'none';
}
function Show2() {
document.getElementById("tdsecond").style.display = 'block';
}
function Hide2() {
document.getElementById("tdsecond").style.display = 'none';
}
function Show3() {
document.getElementById("tdthird").style.display = 'block';
}
function Hide3() {
document.getElementById("tdthird").style.display = 'none';
}
</script>
<style type="text/css">
.style1 {
width: 164px;
}
.style2
{
height: 98px;
}
.style3
{
width: 110px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr style="border-style: solid; border-width: thin; border-color: inherit;">
<div id="div1" >
<td class="style1"
style="border: thin solid #000000; text-align: right;">
<table><tr><td>Menu1</td><td class="style3">
<img alt="" onclick="Show()" src="Image/down%20arrow.jpg"
style="height: 15px; margin-left: 0px" /><img
alt="" onclick="Hide()" src="Image/up%20arrow.jpg" style="height: 15px" /></td></tr></table> </td>
</div>
</tr>
<tr>
<div id="div2">
<td id="tdfirst" class="style2"
style="border: thin solid #000080; text-align: left;display:none;"; >SubMenu1</td>
</div>
</tr>
</table>
<div>
<table>
<tr style="border-style: solid; border-width: thin; border-color: inherit;">
<div id="div3" >
<td class="style1"
style="border: thin solid #000000; text-align: right;">
<table><tr><td>Menu2</td><td class="style3">
<img alt="" onclick="Show2()" src="Image/down%20arrow.jpg"
style="height: 15px; margin-left: 0px" /><img
alt="" onclick="Hide2()" src="Image/up%20arrow.jpg" style="height: 15px" /></td></tr></table> </td>
</div>
</tr>
<tr>
<div id="div4">
<td id="tdsecond" class="style2"
style="border: thin solid #000080; text-align: left;display:none;"; >SubMenu2</td>
</div>
</tr>
</table>
<table>
<tr style="border-style: solid; border-width: thin; border-color: inherit;">
<div id="div5" >
<td class="style1"
style="border: thin solid #000000; text-align: right;">
<table><tr><td>Menu3</td><td class="style3">
<img id="imgdown" alt="" onclick="Show3()" src="Image/down%20arrow.jpg"
style="height: 15px; margin-left: 0px" /><img id="imgup"
alt="" onclick="Hide3()" src="Image/up%20arrow.jpg" style="height: 15px" /></td></tr></table> </td>
</div>
</tr>
<tr>
<div id="div6">
<td id="tdthird" class="style2"
style="border: thin solid #000080; text-align: left;display:none;"; >SubMenu3</td>
</div>
</tr>
</table>
</div>
</form>
</body>
</html>
When I try to display this HTML in a WebBrowser control, nothing appears and the control is blank.
XAML:
<phone:WebBrowser HorizontalAlignment="Left" Margin="0" VerticalAlignment="Top" x:Name="webBrowser1" Grid.Row="1" IsScriptEnabled="True" />
.cs:
webBrowser1.Navigate(new Uri("/Html_Pages/AboutUs.html", UriKind.Relative));
Can anyone see what I'm doing wrong? I'm using VS2012 and the WP8 emulator.
Hope This will help you. NavigateToString()
private void goNavigateToStringButton_Click(object sender, RoutedEventArgs e)
{
// Load HTML document as a string
Uri uri = new Uri(#"pack://application:,,,/HTMLDocumentWithoutScript.html", UriKind.Absolute);
Stream stream = Application.GetResourceStream(uri).Stream;
using (StreamReader reader = new StreamReader(stream))
{
// Navigate to HTML document string
this.webBrowser.NavigateToString(reader.ReadToEnd());
}
}
from : NavigateToString() method