I'm trying to receive Business Account info through the rest API. I try with a filter and without the filter. It is using the default end point and the default BusinessAccount. The results of both runs are below after the code.
My code to get the Acumatica content
public async void GetCustomersActivitiesAsync(int top, string filterOperation, string filter)
{
string url = settings.url + settings.endpoint + "BusinessAccount";
string parametersFilter = "&$filter=BusinessAccount eq 'ABARTENDE'";
var uri = new Uri(url + parametersFilter);
try
{
var response = await client.GetAsync(uri);
if (response.IsSuccessStatusCode)
{
var content = await response.Content.ReadAsStringAsync();
}
else
{
err = await response.Content.ReadAsStringAsync();
try
{
ResponseMessage msg = JsonConvert.DeserializeObject<ResponseMessage>(err);
if (msg != null && msg.exceptionMessage != "") err = msg.exceptionMessage;
}
catch (Exception ex)
{
err = ex.Message;
}
}
}
catch (Exception ex)
{
Debug.WriteLine(#" ERROR {0}", ex.Message);
err = ex.Message;
}
}
When I run the filter it fails auto manically
When I do a filter it returns this:
<!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 id="Head1"><link href="/A000/Content/font-awesome.css?timestamp=636698449900000000" type="text/css" rel="stylesheet" /><link href="/A000/App_Themes/Default/00_Controls.css?timestamp=636698449900000000" type="text/css" rel="stylesheet" /><title>
Error Has Occurred
</title><meta http-equiv="content-script-type" content="text/javascript" />
<style type="text/css">
.main
{
padding-left: 40px;
padding-right: 20px;
padding-top: 30px;
font-family: Arial;
}
.errCode
{
padding-bottom: 20px;
font-family: Arial;
font-size: 15pt;
}
.errMsg
{
font-size: 12pt;
}
.img
{
float: left;
margin-right: 10px;
}
.nxtSt
{
margin-top: 30px;
font-family: Arial;
font-size: 15pt;
}
.navTo
{
margin-top: 10px;
margin-left: 20px;
}
.errPnl
{
padding: 10px;
padding-top: 15px;
}
.grayBox
{
border: solid 1px #CCC;
background-color: #F9F9F9;
padding-top: 20px;
padding-bottom: 25px;
padding-left: 10px;
padding-right: 20px;
}
.traceLnk
{
margin-top: 20px;
}
</style>
<style type="text/css">
.frmBottom_CaptionL { background-position:left top;width:5px; }
.frmBottom_CaptionR { background-position:right top;width:5px; }
.frmBottom_CaptionM { }
</style></head>
<body>
<form name="form1" method="post" action="./Error.aspx" id="form1">
<input type="hidden" name="__RequestVerificationToken" id="__RequestVerificationToken" value="Aq4LEYY5T50IzZfjFHxJWWVP0lq4kLBG-ljIPF3eUYBdBo3UHLHNgHdHF8YW9hpS3nHqiATSFrDybUkJvaXapM_ZItg1" />
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="frmBottom_state" id="frmBottom_state" value="" />
<input type="hidden" name="__SmartPanelVisible" id="__SmartPanelVisible" value="" />
<input type="hidden" name="L10nEditor_state" id="L10nEditor_state" value="" />
<input type="hidden" name="inputBox_state" id="inputBox_state" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="" />
<script type="text/javascript">
//<![CDATA[
var __appPath = '/A000/';var __nodePath="";var __nodeGuid="00000000-0000-0000-0000-000000000000";//]]>
</script>
<script src="/A000/PX.ScriptBatch.axd?d=cFBYLldlYi5VSXxQWC5XZWIuVUkuRXh00&t=636698318120000000" type="text/javascript"></script>
<script src="/A000/PX.ScriptBatch.axd?d=cFBYLldlYi5VSXxQWC5XZWIuVUkuQmFzZQ2&t=636698318120000000" type="text/javascript"></script>
<script src="/A000/PX.ScriptBatch.axd?d=cFBYLldlYi5VSXxQWC5XZWIuVUkuRWRpdA2&t=636698318120000000" type="text/javascript"></script>
<script src="/A000/PX.ScriptBatch.axd?d=cFBYLldlYi5VSXxQWC5XZWIuVUkuR3JpZA2&t=636698318120000000" type="text/javascript"></script>
<script type="text/javascript">
//<![CDATA[
var __loadImgUri = "/A000/App_Themes/Default/Images/spinner.gif?imgTimeStamp=636698449900000000";
var __loadStr = "";
var _numbFormatInfo = {negativeSign:"-",currencySymbol:"$",percentSymbol:"%",number:{groupSeparator:",",decimalSeparator:".",groupSizes:[3],negativePattern:1,decimalDigits:2},currency:{groupSeparator:",",decimalSeparator:".",groupSizes:[3],positivePattern:0,negativePattern:0,decimalDigits:2},percent:{groupSeparator:",",decimalSeparator:".",groupSizes:[3],positivePattern:1,negativePattern:1,decimalDigits:2}};
var _dateFormatInfo = {am:"AM",pm:"PM",shortDate:"M/d/yyyy",shortTime:"h:mm tt",longDate:"dddd, MMMM d, yyyy",longTime:"h:mm:ss tt",timeSeparator:":",yearFix:0,monthNames:"January,February,March,April,May,June,July,August,September,October,November,December,",abbrMonthNames:"Jan,Feb,Mar,Apr,May,Jun,Jul,Aug,Sep,Oct,Nov,Dec,",dayNames:"Sunday,Monday,Tuesday,Wednesday,Thursday,Friday,Saturday",abbrDayNames:"Sun,Mon,Tue,Wed,Thu,Fri,Sat"};
__createPxContext(window);
var __PXFormView = {maxFileSizeMsg:"The file exceeds the maximal allowed size (25000 KB).",allowedFiles:".als;.cer;.csv;.dat;.doc;.docx;.epl;.exe;.gif;.ico;.ics;.jpeg;.jpg;.js;.mdb;.msi;.ofx;.pdf;.pfx;.ppt;.pptx;.qbo;.qfx;.rar;.rtf;.sql;.swf;.txt;.xls;.xlsx;.xml;.zip;.zpl;.pbix;.png;.svg;.tif;.tiff",allowedFilesMsg:"Only the following file types are allowed: {0}.",callbacks:[{name:"Refresh",repaintControls:1,blockPage:1,postData:0},{name:"Search",repaintControls:1,blockPage:1},{name:"Save",repaintControls:1,blockPage:1,commitChanges:1},{name:"Delete",repaintControls:1,blockPage:1},{name:"AddNew",repaintControls:1,blockPage:1,postData:0},{name:"NoteShow",blockPage:1,postData:0},{name:"NoteSave",repaintControls:3,blockPage:1,postData:0},{name:"FilesMenuShow",blockPage:1,postData:0},{name:"ActivityShow",blockPage:1,postData:0},{name:"LinkShow",repaintControls:3,blockPage:1,postData:0},{name:"LinkUpdate",repaintControls:3,blockPage:1,postData:0},{name:"LinkSend",repaintControls:3,blockPage:1,postData:0},{name:"NotifyMenuShow",repaintControls:3,blockPage:1,postData:0},{name:"NotifyShow",repaintControls:3,blockPage:1,commitChanges:1,postData:0},{name:"CheckActivity",blockPage:1,postData:0},{name:"UploadFile",blockPage:1}],errorCss:"FormError",warningCss:"FormWarn",infoCss:"FormInfo",minHeight:63,filesMenuUrls:{filesDisplayUrl:"~/Frames/GetFile.ashx",fileInfoUrl:"~/Pages/SM/SM202510.aspx"}};
var _frmBottom = {allowCollapse:0,minHeight:0,autoSize:{enabled:1,container:1}};
var _confirmMsg = "Any unsaved changes will be discarded.";
var __PXSmartPanel = {callBackMode:{blockPage:1,postData:0}};
var _L10nEditor = {loadOnDemand:1,autoReload:1,commandName:"SaveLoc",autoCallBack:{behavior:{postData:0}}};
var __PXInputBox = {activeEnter:0,buttonCss:"MessageButton",autoAdjustSize:1,callBackMode:{blockPage:1,postData:0}};
var _inputBox = {};
//]]>
</script>
<div class="main">
<div name="frmBottom" id="frmBottom">
<div style="position:relative;">
<div class="errCode">
</div>
<div class="grayBox">
<div class="img">
<img id="frmBottom_imgMessage" tabindex="100" src="../App_Themes/Default/Images/Message/error2.gif" border="0" />
</div>
<div class="errMsg">
<span id="frmBottom_lblMessage" class="errMsg">We're sorry! An error has occurred while processing your request. A report has been generated for our technical staff to investigate the problem. Please try to repeat your request later. Thank you for understanding.</span>
</div>
</div>
<div class="traceLnk">
<a id="frmBottom_lnkTrace" tabindex="101" href="Trace.aspx"><u><font color="Blue" size="4">Show Trace</font></u></a>
</div>
<div class="nxtSt">
</div>
<div class="navTo">
</div>
</div>
</div>
</div>
<table name="L10nEditor" cellspacing="0" cellpadding="0" id="L10nEditor" tabindex="300" class="SmartPanel" style="display:none;">
<tr>
<td id="L10nEditor_cap" class="SmartPanelC" valign="middle"><div class="sprite-icon control-icon" icon="Close" mode="c" style="float:right;">
<div class="control-icon-img control-Close">
</div>
</div>Translations</td>
</tr><tr>
<td class="SmartPanelCN" id="L10nEditor_cont" width="0" height="0"><div class="panelContent">
</div></td>
</tr>
</table><table name="inputBox" cellspacing="0" cellpadding="0" id="inputBox" tabindex="400" class="SmartPanel" width="400" style="display:none;">
<tr>
<td id="inputBox_cap" class="SmartPanelC" valign="middle"><div class="sprite-icon control-icon" icon="Close" mode="c" style="float:right;">
<div class="control-icon-img control-Close">
</div>
</div>Copy to clipboard (Ctrl+C)</td>
</tr><tr>
<td class="SmartPanelCN" id="inputBox_cont" width="400" height="0"><table tabindex="400" border="0" width="100%">
<tr>
<td><input name="inputBox$ctl01" type="text" class="editor" /></td>
</tr><tr>
<td align="right"><button type="button" class="MessageButton Button">OK</button><button type="button" class="MessageButton Button">Cancel</button></td>
</tr>
</table></td>
</tr>
</table></form>
</body>
</html>
The query parameters, such as $filter, are separated from the path by ?. In your case that should give <base url>/BusinessAccount?$filter=<filter espression>.
The HTML code for this form (left hand side) is like below.
<div class="lp-element lp-pom-form" id="lp-pom-form-410">
<form action="#" method="POST">
<div class="lp-pom-form-field clearfix" id="container_name">
<input type="text" id="name" name="name" class="text form_elem_name" placeholder="Name">
</div>
<div class="lp-pom-form-field clearfix" id="container_email">
<input type="text" id="email" name="email" class="text form_elem_email" placeholder="Email">
</div>
</form>
<a class="lp-element lp-pom-button" id="lp-pom-button-411" href="#"><span class="label">GET MY DEMO</span></a>
</div>
I am trying to convert it to aspx and the back-end code for it into vb.net shown below.
<form id="form1" runat="server">
<asp:Panel runat="server" ID="uxForm">
<div class="lp-pom-form-field clearfix" id="container_name">
<asp:TextBox ID="uxName" runat="server" CssClass="text form_elem_name" placeholder="Name" />
</div>
<div class="lp-pom-form-field clearfix" id="container_email">
<asp:TextBox ID="uxEmail" runat="server" CssClass="text form_elem_email" placeholder="Email" />
</div>
</asp:Panel>
</form>
The problem is that I cannot convert the get my demo button in to asp button.
I have tried the following:
<asp:LinkButton runat="server" ID="btnSave" CssClass="lp-element lp-pom-button" Text="Get My Demo" />
but it just become invisible like the picture (right hand side form)
I have also tried
<a class="lp-element lp-pom-button" id="save" runat="server"><span class="label">GET MY DEMO</span></a>
But then also the button goes invisible and the text get my demo is in the name field as shown in the 2nd picture.
What has gone wrong and how can I correct it? the button goes invisible..even without css class
For your information I have not created the vb.net codes yet. Could that be the issue?
CSS
#lp-pom-button-411 {
display:block;
border-style:none;
behavior:url(/PIE.htc);
border-radius:9px;
left:0px;
top:251px;
z-index:16;
width:348px;
height:50px;
position:absolute;
background-color:#f7941d;
background:-webkit-linear-gradient(#fd494b,#fb2c2f);
background:-moz-linear-gradient(#fd494b,#fb2c2f);
background:-ms-linear-gradient(#fd494b,#fb2c2f);
background:-o-linear-gradient(#fd494b,#fb2c2f);
background:linear-gradient(#fd494b,#fb2c2f);
box-shadow:inset 0px 1px 0px #ff9697,inset 0 -1px 2px #c72325;
text-shadow:1px 1px #7a0404;
-pie-background:linear-gradient(#fd494b,#fb2c2f);
color:#fff;
border-width:undefinedpx;
border-color:#undefined;
font-size:25px;
line-height:30px;
font-weight:bold;
font-family:Raleway;
text-align:center;
background-repeat:no-repeat;
}
.button{
display: inline-block;
padding: 17px 34px;
border: 3px solid #fff;
color: #fff;
font-size: 22px;
font-weight: bold;
text-decoration: none;
height: 52px;
width: 123px;
font-family: 'Lato', sans-serif;
background: red;
background: -webkit-linear-gradient(#fe4d4f, #fb2d2e);
background: -o-linear-gradient(#fe4d4f, #fb2d2e);
background: -moz-linear-gradient(#fe4d4f, #fb2d2e);
background: linear-gradient(#fe4d4f, #fb2d2e);
margin-left: 49px;
text-shadow: #000000 1px 0px 1px;
}
.button:hover{
background: red;
background: -webkit-linear-gradient(#f13839, #ee2526);
background: -o-linear-gradient(#f13839, #ee2526);
background: -moz-linear-gradient(#f13839, #ee2526);
background: linear-gradient(#f13839, #ee2526);
}
picture 3
Try this:
<asp:LinkButton runat="server" ID="btnGetDemo" CssClass="lp-element lp-pom-button lp-pom-button-411"><span class="label">GET MY DEMO</span></asp:LinkButton>
My guess is that the "label" class on the span has something to do with it.
EDIT:
I changed the LinkButton markup a bit AND do change the CSS aswell to:
.lp-pom-button-411 {
display:block;
border-style:none;
behavior:url(/PIE.htc);
border-radius:9px;
left:0px;
top:251px;
z-index:16;
width:348px;
height:50px;
position:absolute;
background-color:#f7941d;
background:-webkit-linear-gradient(#fd494b,#fb2c2f);
background:-moz-linear-gradient(#fd494b,#fb2c2f);
background:-ms-linear-gradient(#fd494b,#fb2c2f);
background:-o-linear-gradient(#fd494b,#fb2c2f);
background:linear-gradient(#fd494b,#fb2c2f);
box-shadow:inset 0px 1px 0px #ff9697,inset 0 -1px 2px #c72325;
text-shadow:1px 1px #7a0404;
-pie-background:linear-gradient(#fd494b,#fb2c2f);
color:#fff;
border-width:undefinedpx;
border-color:#undefined;
font-size:25px;
line-height:30px;
font-weight:bold;
font-family:Raleway;
text-align:center;
background-repeat:no-repeat;
}
You are not create button event, create button evetn like this and try:
<asp:button id="btnSave" runat="server" Text="Get My Demo" CssClass="lp-element lp-pom-button" onclick="btnSave_Click">
Use this:
<form id="form1" runat="server">
<asp:Panel runat="server" ID="uxForm">
<div class="lp-pom-form-field clearfix" id="container_name">
<asp:TextBox ID="uxName" runat="server" CssClass="text form_elem_name" placeholder="Name" />
</div>
<div class="lp-pom-form-field clearfix" id="container_email">
<asp:TextBox ID="uxEmail" runat="server" CssClass="text form_elem_email" placeholder="Email" />
</div>
<asp:Button ID="btnSave" runat="server" Text="Get My Demo" CssClass="lp-element lp-pom-button" />
</asp:Panel>
</form>
Context: I’m building a web application using WebMatrix and C# Razor. The application searches a database and returns the results to a WebGrid. Once the results are returned, you can click a Details link and view the details on a new browser tab.
Problem: The initial search, which returns all records, works fine. If I enter search words, the correct results are returned, but when I click on Details, I get details for the record that was in the selected row in the initial search.
Example: The initial search returns records 1-5. The subsequent search returns records 31, 65, 86,92, 101. If I click on Details for record 65, I get details for record 2 because record 2 occupied row 2 in the initial search.
Code:
#{
Layout = "~/_SiteLayout.cshtml";
Page.Title = "Home Page";
}
#{
var db = Database.Open("xyz");
var query = "select bg_bug_id [BUGID], BG_SUMMARY SUMMARY from [dbo].[BUG] where BG_SUMMARY like #0 and BG_SUMMARY like #1";
var input1 = "%" + Request["input1"] + "%";
var input2 = "%" + Request["input2"] + "%";
var data = db.Query(query, input1, input2);
var gridBug = new WebGrid(source: data, canPage: true, canSort: true, rowsPerPage: 10);
if(gridBug.HasSelection){
var recordIdInt = 0;
recordIdInt = gridBug.SelectedRow.Value.BUGID;
var recordId = recordIdInt.ToString();
var bugDescQuery = "select [BG_DESCRIPTION] from [dbo].[BUG] where [BG_BUG_ID] =" + recordId; // or [BG_BUG_ID] = 25001";
var bugDescResult = db.Query(bugDescQuery);
foreach(var item in bugDescResult){
var desc = item.BG_DESCRIPTION;
var modDesc = desc.Replace("<div align=\"left\">", "<div>").Replace("<font face=\"Arial\">", "<font>").Replace("<span style=\"font-size:8pt\">", "<span>");
<script>
$(document).ready(function(){
var x = '#Html.Raw(HttpUtility.JavaScriptStringEncode(modDesc))';
var win = window.open();
win.document.body.innerHTML = "Record ID: " + #recordId + " - -" + x;
})
</script>
}
}
}
<form method="post">
<input type="text" name="input1"/>
<input type="radio" id="and" name="operator" value="and" checked>And
<input type="radio" id="or" name="operator" value="or">Or
<input type="text" name="input2" />
<select>
<option value="Unresolved">Unresolved</option>
<option value="Resolved">Resolved</option>
</select>
<input type="submit" value="Search" />
#gridBug.GetHtml(
tableStyle: "grid",
headerStyle: "head",
alternatingRowStyle: "alt",
columns: gridBug.Columns(
gridBug.Column(header:"", format:#<text>#item.GetSelectLink("Details")</text>, style: "product2"),
gridBug.Column("BUGID", "BUGID", style: "product2"),
gridBug.Column("SUMMARY", "SUMMARY", style: "product")))
</form>
#section script{
<script type="text/javascript">
$(function(){
$('th a, tfoot a').live('click', function() {
$('form').attr('action', $(this).attr('href')).submit();
return false;
});
});
</script>
}
<style type="text/css">
.grid {
margin: 4px;
border-collapse: collapse;
width: 950px;
margin-left: 5px
}
.head {
background-color: #0094ff;
font-weight: bold;
color: #fff;
}
.grid th, .grid td {
border: 1px solid #c0c0c0;
padding: 5px;
}
.alt {
background-color: #e8e8e8;
color: #000;
}
.product {
width: 200px;
font-weight: normal;
}
.product2 {
width: 10px;
font-weight: normal;
}
</style>
SOURCE AFTER 2nd SEARCH:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<title>Home Page</title>
<link href="/Content/themes/base/jquery.ui.all.css" rel="stylesheet" type="text/css" />
<link href="/Content/Site.css" rel="stylesheet" type="text/css" />
<link href="/favicon.ico" rel="shortcut icon" type="image/x-icon" />
<script src="/Scripts/jquery-1.8.2.min.js"></script>
<script src="/Scripts/jquery-ui-1.8.24.js"></script>
<script src="/Scripts/modernizr-2.6.2.js"></script>
<meta name="viewport" content="width=device-width" />
<script type="text/javascript">
$(function(){
$('th a, tfoot a').live('click', function() {
$('form').attr('action', $(this).attr('href')).submit();
return false;
});
});
</script>
</head>
<body>
<header>
<div class="content-wrapper">
<div class="float-left">
<p class="site-title">XXXX</p>
</div>
<div class="float-right">
<section id="login">
<ul>
<li>Register</li>
<li>Log in</li>
</ul>
</section>
<nav>
<ul id="menu">
<li>XXXX</li>
<li>XXXX</li>
<li>XXXX</li>
</ul>
</nav>
</div>
</div>
</header>
<div id="body">
<section class="content-wrapper main-content clear-fix">
<form method="post">
<input type="text" name="input1"/>
<input type="radio" id="and" name="operator" value="and" checked>And
<input type="radio" id="or" name="operator" value="or">Or
<input type="text" name="input2" />
<select>
<option value="Unresolved">Unresolved</option>
<option value="Resolved">Resolved</option>
</select>
<input type="submit" value="Search" />
<table class="grid">
<thead>
<tr class="head">
<th scope="col">
</th>
<th scope="col">
BUGID </th>
<th scope="col">
SUMMARY </th>
</tr>
</thead>
<tfoot>
<tr >
<td colspan="3">1 2 3 > </td>
</tr>
</tfoot>
<tbody>
<tr>
<td class="product2">Details</td>
<td class="product2">1655</td>
<td class="product">summary text for record 1655</td>
</tr>
<tr class="alt">
<td class="product2">Details</td>
<td class="product2">2516</td>
<td class="product">summary text for record 2516</td>
</tr>
<tr>
<td class="product2">Details</td>
<td class="product2">2639</td>
<td class="product">summary text for record 2639</td>
</tr>
<tr class="alt">
<td class="product2">Details</td>
<td class="product2">2643</td>
<td class="product">summary text for record 2643</td>
</tr>
<tr>
<td class="product2">Details</td>
<td class="product2">3493</td>
<td class="product">summary text for record 3493</td>
</tr>
<tr class="alt">
<td class="product2">Details</td>
<td class="product2">3746</td>
<td class="product">summary text for record 3746</td>
</tr>
<tr>
<td class="product2">Details</td>
<td class="product2">3864</td>
<td class="product">summary text for record 3864</td>
</tr>
<tr class="alt">
<td class="product2">Details</td>
<td class="product2">5172</td>
<td class="product">summary text for record 5172</td>
</tr>
<tr>
<td class="product2">Details</td>
<td class="product2">7156</td>
<td class="product">summary text for record 7156</td>
</tr>
<tr class="alt">
<td class="product2">Details</td>
<td class="product2">7532</td>
<td class="product">summary text for record 7532</td>
</tr>
</tbody>
</table>
</form>
<style type="text/css">
.grid {
margin: 4px;
border-collapse: collapse;
width: 950px;
margin-left: 5px
}
.head {
background-color: #0094ff;
font-weight: bold;
color: #fff;
}
.grid th, .grid td {
border: 1px solid #c0c0c0;
padding: 5px;
}
.alt {
background-color: #e8e8e8;
color: #000;
}
.product {
width: 200px;
font-weight: normal;
}
.product2 {
width: 10px;
font-weight: normal;
}
</style>
</section>
</div>
<footer>
<div class="content-wrapper">
<div class="float-left">
<p>© 2015 - XXXX</p>
</div>
</div>
</footer>
</body>
</html>
I am working on a project, but having problem with applying CSS only to navigation bar. My project contains
master page
home.aspx
gallery.aspx
When I apply menu.css file to navigation bar on master.page it effects rest of the tables as well as other content pages (home.aspx and gallery.aspx) my code looks like following:
master.page
<body style="background-image: url('/WebSite5/bacground/Fruit-drinks-vector-pptbackgrounds.jpg')">
<form id="form1" runat="server">
<div>
<asp:ContentPlaceHolder id="ContentPlaceHolder1" runat="server">
<table align="center" class="style1">
<tr>
<td style="text-align: center">
<img alt="" class="style2" src="bacground/logo.png" />
</td>
</tr>
<tr>
<td>
<uc1:menu ID="menu1" runat="server" />
</td>
</tr>
</table>
</asp:ContentPlaceHolder>
</div>
<table class="style3">
<tr>
<td style="text-align: center">
<asp:ContentPlaceHolder ID="ContentPlaceHolder3" runat="server">
</asp:ContentPlaceHolder>
</td>
</tr>
</table>
</form>
</body>
menu.ascx
<table class="style1">
<tr>
<td>
<ul id="nav">`enter code here`
<li class="home" aria-orientation="horizontal">Home</li>
<li class="Gallery">Gallery</li>
<li class="events">Events</li>
<li class="About US">About US</li>
<li class="contact">Contact</li>
</ul>
</td>
</tr>
</table>
menu.css
#ul li {
list-style: none;
height: 44px;
float: left;
padding: 10px 5px;
width: 175px;
}
#ul li a {
width: 146px;
height: 40px;
line-height: 53px;
border-bottom: 4px solid #636393;
padding:0px;
color: #fff;
font-size:18px;
font-weight:lighter;
text-align:center;
text-decoration: none;
display: block;
-webkit-transition: .2s all linear;
-moz-transition: .2s all linear;
-o-transition: .2s all linear;
transition: .2s all linear;
}
#li:nth-child(1) a {
border-color: #636393;
}
#li:nth-child(2) a {
border-color: #B5222D;
}
#li:nth-child(3) a {
border-color: #D4953C;
}
#li:nth-child(4) a {
border-color: #609491;
}
#li:nth-child(5) a {
border-color: #87A248;
}
#li:nth-child(1) a:hover {
border-bottom: 35px solid #636393;
height: 9px;
}
#li:nth-child(2) a:hover {
border-bottom: 35px solid #B5222D;
height: 9px;
}
#li:nth-child(3) a:hover {
border-bottom: 35px solid #D4953C;
height: 9px;
}
#li:nth-child(4) a:hover {
border-bottom: 35px solid #609491;
height: 9px;
}
#li:nth-child(5) a:hover {
border-bottom: 35px solid #87A248;
height: 9px;
}
Please help me.
To apply CSS to one element use id, ex. then in CSS:
#nav {
color:yellow;
}
#nav li {
font-size:19pt;
}
Rest of the elements (without id==nav) will not be affected.
Example:
http://jsfiddle.net/igos/tJWq6/
I have this script in Master page (it shows a panel on hover of menu element)
<script type="text/javascript" src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#<%= menu1_lbl.ClientID %>').hover(function() {
$('#<%= sub_menu1_lbl.ClientID %>').slideDown(200);
},
function() {
$('#<%= sub_menu1_lbl.ClientID %>').hide();
});
$('#<%= sub_menu1_lbl.ClientID %>').hover(function() {
$('#<%= sub_menu1_lbl.ClientID %>').show();
$('#<%= menu1_lbl.ClientID %>').addClass("menuhover");
},
function() {
$('#<%= sub_menu1_lbl.ClientID %>').hide();
$('#<%= menu1_lbl.ClientID %>').removeClass("menuhover");
});
});
</script>
it works fine on Chrome & Firefox but it doesnt work in IE. Any ideas on what should I do to make it work?
thanks in advance.
UPDATE: Here is the full client-side generated code:
<!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>
<title>Smart Finance </title>
<style type="text/css">
</style>
</head>
<body>
<form name="aspnetForm" method="post" action="ie_not_compatible.aspx" id="aspnetForm">
<div>
<input type="hidden" name="__EVENTTARGET" id="__EVENTTARGET" value="" />
<input type="hidden" name="__EVENTARGUMENT" id="__EVENTARGUMENT" value="" />
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTY1NDU2MTA1Mg9kFgJmD2QWBAIBD2QWAgIBDxUHFi9GaW5hbmNhL2ltYWdlcy9iZy5wbmcZL0ZpbmFuY2EvaW1hZ2VzL2ltZzAzLmpwZxYvRmluYW5jYS9pbWFnZXMvYmcucG5nGS9GaW5hbmNhL2ltYWdlcy9pbWcwMi5qcGcZL0ZpbmFuY2EvaW1hZ2VzL2ltZzAyLmpwZxkvRmluYW5jYS9pbWFnZXMvaW1nMDIuanBnGS9GaW5hbmNhL2ltYWdlcy9pbWcwMi5qcGdkAgMPZBYCAgkPZBYCAgEPDxYCHgRUZXh0BQVlbmRyaWRkGAEFHl9fQ29udHJvbHNSZXF1aXJlUG9zdEJhY2tLZXlfXxYDBRhjdGwwMCRMb2dpblN0YXR1czEkY3RsMDEFGGN0bDAwJExvZ2luU3RhdHVzMSRjdGwwMwUMY3RsMDAkY29uZmlnwdDc6GaGSg1K9roW+pf9g9bwZ08=" />
</div>
<script type="text/javascript">
//<![CDATA[
var theForm = document.forms['aspnetForm'];
if (!theForm) {
theForm = document.aspnetForm;
}
function __doPostBack(eventTarget, eventArgument) {
if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
theForm.__EVENTTARGET.value = eventTarget;
theForm.__EVENTARGUMENT.value = eventArgument;
theForm.submit();
}
}
//]]>
</script>
<div>
<input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAwKDjNy/AwLh8tHdBgL0/brqCByGAqyFdaUy3EVtuUCi/i44T7vY" />
</div>
<div id="menu" style="top: 12px; width: 1250px; position: relative; float: left;">
<ul>
<li>Home</li>
<li id="faturatli">Default </li>
</ul>
</div>
<div id="ctl00_sub_menu1_lbl" style="display: none; top: 137px; padding: 15px 15px 15px 15px;
box-shadow: 0px 5px 15px rgba(0, 0, 0, .5); z-index: 99999; left: 155px; position: absolute;
float: left; width: 300px; background: #FFFFFF;">
Submenu panel
</div>
<div id="logoutcontainer" style="top: 113px; right: 50px; position: absolute;">
<div id="ctl00_Panel1" onkeypress="javascript:return WebForm_FireDefaultButton(event, 'ctl00_config')">
<span id="ctl00_userloggedin" style="color: #ADC9C9; font-size: small; font-weight: 700;">
endri</span> <a id="ctl00_LoginStatus1" href="javascript:__doPostBack('ctl00$LoginStatus1$ctl00','')"
style="color: #CCFFFF; font-size: small; font-weight: 700;">Logout</a>
<input type="image" name="ctl00$config" id="ctl00_config" src="images/config.png"
style="height: 20px; border-width: 0px;" />
</div>
</div>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.8.0.js"></script>
<script defer="defer" type="text/javascript">
$(document).ready(function () {
"use strict";
$('#ctl00_menu1_lbl').hover(function () {
$('#ctl00_sub_menu1_lbl').slideDown(200);
}, function () {
$('#ctl00_sub_menu1_lbl').hide();
});
$('#ctl00_sub_menu1_lbl').hover(function () {
$('#ctl00_sub_menu1_lbl').show();
$('#ctl00_menu1_lbl').addClass("menuhover");
}, function () {
$('#ctl00_sub_menu1_lbl').hide();
$('#ctl00_menu1_lbl').removeClass("menuhover");
});
});
</script>
<div id="ContentDiv" style="float: left; position: relative; margin: 50px 50px 50px 50px;
text-align: left; top: 21px; left: 0px;">
<span class="style3">Not working on internet explorer.</span>
</div>
<script src="/finance/WebResource.axd?d=lLeg7eZU8UNEVWRCMptUog2&t=633750586290014532"
type="text/javascript"></script>
</form>
</body>
</html>
Hey This error usually comes when jquery library is not loaded properly.
Try to load it this way
<script type="text/javascript" src='<%=Page.ResolveUrl("http://code.jquery.com/jquery-1.7.2.min.js")%>'></script>