I am stuck in vary basic problem "The website cannot display the page "
The page "sfcRecInsplst.asp" page is there if i changed it to szhref="http://google.com/" it redirecting to the google. but why not sfcRecInsplst.asp page?
What should i check? how to solve this issue
function DoSearch(){
var szhref;
var szplantid;
var szwono;
var szskuno;
var szcartonpn;
var szfromdate;
var sztodate;
szfromdate=document.search.lfromdate.value;
sztodate=document.search.ltodate.value;
szplantid=document.search.lPlantid.value;
szhref="sfcRecInsplst.asp?pfromdate=" + szfromdate +"&ptodate=" + sztodate+"&lplantid=" + szplantid;
win=window.open(szhref,'CartonUsagerpt','toolbar=yes,top=0,left=0,width=<%=session("width")%>,height=<%=session("height")-100%>,menubar=yes,scrollbars=yes,maximize=yes,resizable=yes,status=yes,statusbar=yes');
win.focus;
}
function DoSearchReset() {
document.search.reset();
}
function lRecestatus_onkeypress(){
if (window.event.keyCode ==13)
{
DoSearch();
}
}
</script>
<table width="80%" bgcolor="#c0c0c0" border="1" rules="NONE" cellspacing="0" cellpadding="0">
<tr>
<td align=right valign=bottom>
<a href="JavaScript:DoSearch();">
<img src="/images/goe.gif" border="0" alt="Search" valign="middle"><font face="Arial, Helvetica, sans-serif" size="1">Go</font></a>
<a href="JavaScript:DoSearchReset();">
<img src="/images/resete.gif" border="0" alt="Reset" valign="middle"><font face="Arial, Helvetica, sans-serif" size="1">Reset</font></a>
You don't mention what version of IIS you are using, but in IIS 8 you can enable parent paths by doing the following:
Under Sites, click on your web site.
In the Features View pane, double-click on ASP.
Set Enable Parent Paths to True.
You may need to restart IIS for it to take effect.
Related
I am new to webapi as well as angular and cannot find a proper solution to this, please help me out and if you can please suggest me some good resources to learn about this topic.
productResource.js file:
(function () {
"use strict";
angular.module('Random')
.factory('productResource', function ($resource) {
return $resource("http://localhost:60208/");
});
});
T.js file
var app = angular.module("JobsApp", []);
app.controller("JobController", function($scope,$http,productResource)
{
$scope.Jobs = productResource.query();
});
Index.cshtml file:
<div ng-app="JobsApp">
<div ng-controller="JobController">
<table class="table">
<tr>
<th>Job Id</th>
<th>Description</th>
<th>Minimum</th>
<th>Maximum</th>
</tr>
<tr ng-repeat="j in Jobs">
<td>{{j.job_id}}</td>
<td>{{j.job_desc}}</td>
<td>{{j.min_lvl}}</td>
<td>{{j.max_lvl}}</td>
</tr>
</table>
</div>
</div>
You need to inject ngResource to you module to get it working. Like
(function () {
"use strict";
angular.module('Random',['ngResource'])
.factory('productResource', function ($resource) {
return $resource("http://localhost:60208/");
});
});
Update
Your URL seems to be incorrect too. You need to create a WebAPI controller class at backend to communicate, It should be RESTful like /User/jobs.
Further please ensure that you have added angular-resource.js in your app.
Refer this http://fdietz.github.io/recipes-with-angular-js/consuming-external-services/consuming-restful-apis.html
make your code like below..
var app = angular.module("JobsApp",["ngResource"]);
app.controller("JobController",['$scope','productResource', function($scope, productResource){
productResource.query(function(value) {
$scope.Jobs=value;
//console.log(value);
});
}]);
app.factory('productResource', function ($resource) {
return $resource('http://jsonplaceholder.typicode.com/posts');
});
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular-resource.js"></script>
</head>
<body ng-app="JobsApp">
<div ng-controller="JobController">
<div>
<table class="table">
<tr>
<th>Job Id</th>
<th>Description</th>
<th>Minimum</th>
<th>Maximum</th>
</tr>
<tr ng-repeat="job in Jobs">
<td>{{job.id}}</td>
<td>{{job.title}}</td>
<td>{{job.userId}}</td>
<td></td>
</tr>
</table>
</div>
</div>
</body>
</html>
i am trying to develop a web application using razor view engine. It is an vacation request management system where users log onto the web site and submit vacation requests through a web form. All requests are stored in a database table called "LeaveRequests". At the moment i am trying to alter a page so when a user is logged in all the vacation requests they made are displayed on the web page in a table view. the code shown below works fine to display 1 request made by a user but i need to alter it to display all requests made by the user. i have tried using a foreach statement but keep getting errors whatever i try , can anyone point my in the right direction and tell me how i need to alter my code to achieve what i want ?
var db = Database.Open("Annual Leave System");
var dbCommand2 = "SELECT * FROM LeaveRequests WHERE email = #0";
var row2 = db.QuerySingle(dbCommand2, theEmail);
if(row2 != null) {
description = row2.description;
theLeaveType = row2.leaveType;
startDate = row2.startDate;
endDate = row2.endDate;
shortStartDate = startDate.ToString("dd-MMMM-yyyy");
shortEndDate = endDate.ToString("dd-MMMM-yyyy");
inttotalDays = row2.totalDays;
requestStatus = row2.requestStatus;
}
<fieldset>
<legend>Employee Leave Request Details</legend>
<table border="1" width="100%">
<tr bgcolor="grey">
<th>Description</th>
<th>Leave Type</th>
<th>Start Date</th>
<th>End Date</th>
<th>Total days leave requested</th>
<th>Request Status</th>
</tr>
<tr>
<th>#description</th>
<th>#theLeaveType</th>
<th>#shortStartDate</th>
<th>#shortEndDate</th>
<th>#inttotalDays</th>
<th>#requestStatus</th>
</tr>
</table>
</fieldset>
The QuerySingle method will only return one row. You need to use the Query method to get all rows.
var rows = db.Query(dbCommand2, theEmail);
Then in the HTML part of the file:
<fieldset>
<legend>Employee Leave Request Details</legend>
<table border="1" width="100%">
<tr bgcolor="grey">
<th>Description</th>
<th>Leave Type</th>
<th>Start Date</th>
<th>End Date</th>
<th>Total days leave requested</th>
<th>Request Status</th>
</tr>
#foreach(var row in rows){
<tr>
<td>#row.description</td>
<td>#row.leaveType</td>
<td>#row.startDate.ToString("dd-MMMM-yyyy")</td>
<td>#row.endDate.ToString("dd-MMMM-yyyy")</td>
<td>#row.totalDays</td>
<td>#row.requestStatus;</td>
</tr>
}
</table>
More information here:
http://www.mikesdotnetting.com/Article/214/How-To-Check-If-A-Query-Returns-Data-In-ASP.NET-Web-Pages
http://www.asp.net/web-pages/tutorials/data/5-working-with-data
I have created a form that has multiple sections that are hidden. A tab strip hides/shows the sections to create a page with a smaller footprint. While this makes the page a lot cleaner, it makes it hard to show errors to the user after validation. I want to make an indicator in the tabs that shows that the content in the specified tab has errors.
Main View:
<div>
<ul class="contentTabs">
<li onclick="switchTab(this)" class="selected">Contact</li>
<li onclick="switchTab(this)">Information</li>
<li onclick="switchTab(this)">Software</li>
<li onclick="switchTab(this)">Hardware</li>
<li onclick="switchTab(this)">Classification</li>
<li onclick="switchTab(this)" class="last">Solution</li>
</ul>
<div class="content">
<div id="contact" class="contentPane">
#Html.Partial("_Contact")
</div>
<div id="information" class="contentPane" style="display: none;">
#Html.Partial("_Information")
#Html.Partial("_Notes")
</div>
<div id="notes" class="contentPane" style="display: none;">
#Html.Partial("_Notes")
</div>
<div id="software" class="contentPane" style="display: none;">
#Html.Partial("_Software")
</div>
<div id="hardware" class="contentPane" style="display: none;">
#Html.Partial("_Hardware")
</div>
<div id="classification" class="contentPane" style="display: none;">
#Html.Partial("_Classification")
</div>
<div id="solution" class="contentPane" style="display: none;">
#Html.Partial("_Solution")
</div>
</div>
</div>
Partial View (Contact):
#code
Dim notifyTypes As ListItemCollection = DirectCast(ViewData("NotifyTypes"), ListItemCollection)
Dim callerTypes As ListItemCollection = DirectCast(ViewData("CallerTypes"), ListItemCollection)
Dim reportingTypes As ListItemCollection = DirectCast(ViewData("ReportingTypes"), ListItemCollection)
Dim myIncident As Library.BusinessLayer.Incident = DirectCast(Model, Library.BusinessLayer.Incident)
End Code
<table class="tableBorderless" style="width: 99%; margin: 0px auto">
<tr>
<td class="right">User Location</td>
<td class="left">
#Html.DropDownList("LocationId", DirectCast(ViewData("Locations"), SelectList), New With {.style = "width: 200px"})<br />
#Html.ValidationMessage("LocationId", New With {.class = "red"})
</td>
<td class="right">Notify</td>
<td class="left">
#For Each notificationType As ListItem In notifyTypes
#<input type="radio" name="Notify" value="#notificationType.Value" #IIf(notificationType.Selected, "checked", "") />#notificationType.Text
Next
</td>
</tr>
<tr>
<td class="right">Caller Type</td>
<td colspan="3" class="left">
#For Each callerType As ListItem In callerTypes
#<input type="radio" name="CallerType" value="#callerType.Value" #IIf(callerType.Selected, "checked", "") />#callerType.Text
Next
</td>
</tr>
<tr>
<td class="right">User Network ID</td>
<td class="left">
#Html.TextBox("UserId", myIncident.UserId, New With {.onchange = "UserId_onchange(this)", .maxlength = "30"})
</td>
<td class="right">User Name</td>
<td class="left">
#Html.TextBox("UserName", myIncident.UserName, New With {.maxlength = "50"})<br />
#Html.ValidationMessage("UserName", New With{.class = "red"})
</td>
</tr>
<tr>
<td class="right">User Email</td>
<td class="left">
#Html.TextBox("UserEmail", myIncident.UserEmail, New With {.maxlength = "50"})<br />
#Html.ValidationMessage("UserEmail", New With{.class = "red"})
</td>
<td class="right">User Phone</td>
<td class="left">
#Html.TextBox("UserPhone", myIncident.UserPhone, New With {.maxlength = "50"})
</td>
</tr>
<tr>
<td class="right">Reporting Type</td>
<td colspan="3" class="left">
#For Each reportingType As ListItem In ReportingTypes
#<input type="radio" name="ReportedByType" value="#reportingType.Value" #IIf(reportingType.Selected, "checked", "") />#reportingType.Text
Next
</td>
</tr>
<tr>
<td class="right">Reported by (Network ID)</td>
<td class="left">
#Html.TextBox("ReportedByUserId", myIncident.ReportedByUserId, New With {.onchange = "ReportedByUserId_onchange(this)", .maxlength = "30"})
</td>
<td class="right">Reported by Name</td>
<td class="left">
#Html.TextBox("ReportedByName", myIncident.ReportedByName, New With {.maxlength = "50"})<br />
#Html.ValidationMessage("ReportedByName", New With {.class = "red"})
</td>
</tr>
<tr>
<td class="right">Reported by Email</td>
<td class="left">
#Html.TextBox("ReportedByEmail", myIncident.ReportedByEmail, New With {.maxlength = "50"})<br />
#Html.ValidationMessage("ReportedByEmail", New With {.class = "red"})
</td>
<td class="right">Reported by Phone</td>
<td class="left">
#Html.TextBox("ReportedByPhone", myIncident.ReportedByPhone, New With {.maxlength = "50"})
</td>
</tr>
</table>
<script type="text/javascript">
function UserId_onchange(textField) {
var parms = {UserName: textField.value};
$.ajax({
url: '#Url.RouteUrl(New With{.Controller = "Users", .Action = "Get"})',
type: 'POST',
dataType: 'json',
data: parms,
success: function (data) {
$("#UserName").val(data.Name);
$("#UserEmail").val(data.Email);
$("#UserPhone").val(data.PhoneWork);
}
});
}
function ReportedByUserId_onchange(textField) {
var parms = { UserName: textField.value };
$.ajax({
url: '#Url.RouteUrl(New With{.Controller = "Users", .Action = "Get"})',
type: 'POST',
dataType: 'json',
data: parms,
success: function (data) {
$("#ReportedByName").val(data.Name);
$("#ReportedByEmail").val(data.Email);
$("#ReportedByPhone").val(data.PhoneWork);
}
});
}
</script>
You could check whether appropriate tab's div has any "input-validation-error" class applied (taken you use standard DataAnnotations). Combine this into jQuery function which would run through all needed divs (probably all divs specified in your li elements) and if length of elements with "input-validation-error" class is more than 0, as #rivarolle suggested apply "error" class to li element to highlight it in your preferred way.
This would be a possible script:
$( "li" ).each(function( index ) {
var searchPattern = ("#"+$(this).text()+" .input-validation-error");
if ($(searchPattern.toLowerCase()).length > 0){
$(this).addClass("error");
}
});
css:
.error {
background-color: red;
}
Give your li elements IDs
<li onclick="switchTab(this)" id="softwareTab">Software</li>
Then pass the collection of validation objects, or, better a list of affected tab names in your ViewModel, and store the list in one or more hidden fields. Then use jQuery to parse the list and add the error class as suggested by rivarolle...
$("#softwareTab").addClass("error")
You may have to clean up later with removeClass().
There are many ways to do this, all a bit kludgy, but sometimes that is the price of a good looking page...one hidden field with a comma seperated list, one hidden field per tab with a boolean value...or pseudo-boolean.
I think, The page should be divided into partial views. Each partial view needs to be validated before proceeding to next step. For that we can write a helper Method. When user fills the data and post the section, then controller checks and fills your custom validation error collection and it can be passed on as model metadata i.e. buddy class in your model. This way , you will render the errors. i.e. we are using model-metadata to send validation errors.
If you don't want to use model approach then you need to use ViewBag collection which is dynamic collection.
Hope this helps.
What you will probably need to do is use the visibility of the various validation messages.
The way I'd approach this is by adding a custom class to the validation messages for use within jquery:
#Html.ValidationMessage("UserName", New With{.class = "red validationMesssage"})
Then in the switchTab function do something like this:
function switchTab(el)
{
var tabId=$(el).text(); //Get the tab to be searched
var isValid=true; //Set default as valid
$("#"+tabId).find(".validationMessage:visible").each(function(){
isValid=false; //this should only fire if the validation message is visible
});
if(!isValid)
$(el).addClass("errors"); //If invalid..add error class to li element.
}
You can try #Html.ValidationSummary(false) at the top MAIN view. Its better from usability perspective as well.
You could change the color of the tab headers that contain errors to red for instance.
To do this, I would switch the css of the tags.
To take the Information tab:
No error:
--> <li onclick="switchTab(this)">Information</li>
Error:
--> <li onclick="switchTab(this)" class="error">Information</li>
The CSS class "error" will change the color to red or append an image to indicate validation failure.
In a declarative dojox.grid.datagrid, am using onresizecolumn in table tag.
onresizecolumn="columnResize(this.id,this.cellIdx)"
onresizecolumn calls a function. on resizing particular column i want to get the cellIdx.
<div class="claro" id="eterte" name="dataGrid" onclick="getConnect('inner__eterte');setWidgetproperty(this.id,'xy','inner__eterte');" ondblclick="editCustomGrid(this.id)" onmouseup="setDocStyle(this.id)" style="height:200px; left:39px; position:absolute; top:251px; width:950px;">
<table class="claro" dojotype="dojox.grid.DataGrid" id="inner__eterte" onresizecolumn="columnResize(this.id,this.cellIdx)" rowselector="10px" style="height: 180px; width: 400px;">
<thead>
<tr>
<th field="Column1" id="Column1_6" width="159px">
Column1
</th>
</tr>
</thead>
</table>
<input id="hidden__eterte" name="dataGrid" style="display:none;" type="hidden">
</div>
function columnResize(id,index){
alert();
alert(id);
alert(index);
}
By reading the API documentation I come to the conclusion that Dojo automatically sends the Cell index to the event handler. So the solution is by simply providing the following attribute onResizeColumn="myFunction" and then you define a function like this:
function myFunction(cellDx) {
alert(cellDx);
}
This should work, I even made a JSFiddle to test it. By the way, is there any reason why you would like to do all of it in a declarative way? As far as my experience goes, it's a lot easier to write most of this in JavaScript.
I can get it working this way, not sure if it's a best practice.
http://jsfiddle.net/gE8rH/6/
HTML (removed onresizecolumn attribute):
<div class="claro" id="eterte" name="dataGrid" onclick="getConnect('inner__eterte');setWidgetproperty(this.id,'xy','inner__eterte');" ondblclick="editCustomGrid(this.id)" onmouseup="setDocStyle(this.id)" style="height:200px; width:950px;">
<table dojotype="dojox.grid.DataGrid" id="inner__eterte" rowselector="10px" style="height: 180px; width: 400px;">
<thead>
<tr>
<th field="Column1" id="Column1_6" width="109px">Column1</th>
<th field="Column2" id="Column1_7" width="109px">Column2</th>
<th field="Column2" id="Column1_8" width="109px">Column3</th>
</tr>
</thead>
</table>
</div>
JS (using Dojo 1.7+ module names), assign to the widget's onResizeColumn property:
require(["dojo/parser", "dijit/registry", "dojox/grid/DataGrid"], function (parser, registry) {
parser.parse().then(afterParse);
function afterParse() {
var d = registry.byId("inner__eterte");
console.log(d);
d.onResizeColumn = function (colIdx) {
console.log("columnResize");
console.log("args", arguments);
console.log("this", this);
console.log("colIdx", colIdx);
};
}
});
Outputs this when resizing the first column:
columnResize
args [0]
this [Widget dojox.grid.DataGrid, inner__eterte] { _attachPoints=[4], _attachEvents=[1], _connects=[0], more...}
colIdx 0
I have a Table (or a region) and want to set it's Width and Height value to another Div (or region).
The second one is actually a Ajax Indicator modal which display a loading text when the page is asynchronously post back. here is the example
<table id="MainTable">
<tr>
<td>
Content ....
</td>
</tr>
</table>
<div id="Progress">
Ajax Indocator
</div>
the following javascript didn't work
document.getElementById("Progress").style.width = document.getElementById("MainTable").style.width;
document.getElementById("Progress").style.height = document.getElementById("MainTable").style.height;
It should work both on IE and FireFox. how to correct it.
I checked some other solution in StackOverFlow but I couldn't fix it.
I'm waiting to hear from you.
Update : I use this
<script>
function SetSize(regionToChange, mainRegion) {
$(document).ready(function() {
$('#regionToChange)
.width($('#mainRegion).outerWidth())
.height($('#mainRegion).outerHeight());
});
}
</script>
and I call it like
<asp:Button ID="btnReset" runat="server" SkinID="Button" Text="Reset" OnClick="btnReset_OnClick" OnClientClick="SetSize('Progress', 'MainTable');" />
But it shows me an error which can not find the object
Update 2 I see this error
and in debugger I face with this
spoken in jQuery:
$(document).ready(function(){
$('#Progress')
.width($('#MainTable').outerWidth())
.height($('#MainTable').outerHeight());
});
in jQuery you can do
$("#Progress").css('width', function(){
return $("#MainTable").width()+'px';
});
and so with the height...
edit
on javascript,
this
document.getElementById("Progress").style.width = document.getElementById("MainTable").style.width;
document.getElementById("Progress").style.height = document.getElementById("MainTable").style.height;
will work if your html is something like this for id="MainTable"
<table id="MainTable" style="width: 500px; height: 300px;">
<tr>
<td>
Content ....
</td>
</tr>
</table>
because you are accessing style attribute...
edit2
function SetSize(regionToChange, mainRegion) {
$(regionToChange)
.width($(mainRegion).outerWidth())
.height($(mainRegion).outerHeight());
}
//you can use it as
SetSize('#Progress','#MainTable'); // prefix '#'if it's an ID