|
Hi,
I want to fetch data from SQL database, and display the same on my HTML page in table format using Angular JS.
I am able to get the data in the scope variable, but it is not getting displayed in the HTML page.
Please check the code that I have written below, and help me fixing the issue.
Thanks in advance.
HTML code:
<html>
<head>
<title>:: View Logs ::</title>
<script src="Scripts/angular.js"></script>
<script src="Scripts/angular.min.js"></script>
<script src="Scripts/logsController.js"></script>
<script src="Scripts/jquery-2.1.1.js"></script>
<script src="Scripts/jquery-2.1.1.min.js"></script>
</head>
<body>
| Log ID | User Type | User Name | Email ID | Action Type | Section Name | Section Details | DateTime | User IP |
|---|
| {{item.LogID}} | {{item.UserType}} | {{item.UserName}} | {{item.EmailID}} | {{item.ActionType}} | {{item.SectionName}} | {{item.SectionDetails}} | {{item.DateTime}} | {{item.UserIP}} |
</body>
</html>
logsController.js code:
angular.module('ViewLogsApp', [])
.controller('ViewLogsController', [
'$scope', function ($scope) {
$scope.logslist = [];
$scope.load;
$scope.load = function () {
$.ajax({
type: 'GET',
contentType: 'application/json; charset=utf-8',
url: 'UserActivityLogs.aspx/getList',
success: function (data) {
$scope.logslist = data
$scope.$apply();
}
});
}
$scope.load();
}
]);
WebMethod code:
[System.Web.Services.WebMethod]
[ScriptMethod(UseHttpGet = true, ResponseFormat = ResponseFormat.Json)]
public static List<useractivitylogslist> getList()
{
SqlConnection con = new SqlConnection();
con.ConnectionString = _connstr;
con.Open();
var logs = new List<useractivitylogslist>();
string get = "select * from UserActivityLogs";
//string get = "sp_employee";
SqlCommand cmd = new SqlCommand(get, con);
SqlDataReader dr = cmd.ExecuteReader();
while (dr.Read())
{
UserActivityLogsList e = new UserActivityLogsList();
e.LogID = Convert.ToInt32(dr[0]);
e.UserType = Convert.ToString(dr[1]);
e.UserName = Convert.ToString(dr[2]);
e.EmailID = Convert.ToString(dr[3]);
e.ActionType = Convert.ToString(dr[4]);
e.SectionName = Convert.ToString(dr[4]);
e.SectionDetails = Convert.ToString(dr[4]);
e.DateTime = Convert.ToString(dr[4]);
e.UserIP = Convert.ToString(dr[4]);
logs.Add(e);
}
con.Close();
return logs;
}
Clouds come floating into my life, no longer to carry rain or usher storm, but to add color to my sunset sky. ~Rabindranath Tagore
|
|
|
|
|
Try to display the data of single column first.
To make sure if you are really getting your data at javaScript level and to make sure if your $scope is really working fine first try this snippet in your html. If it works than try all columns.
If it does not work than try this in your html and body tags
and
hopefully it would work....cheers
|
|
|
|
|
Just a rhetorical question...but sometimes when I'm looking for the correct code, things get so convoluted! When I figure it out, like how to stop a timer with the clear interval...face palm! It was so easy! I feel like there is something missing from my understanding or just my novice status, needing more experience. Thanks all for listening/reading my "moment".
|
|
|
|
|
What was the issue you found by yourself.... let me check if our understanding matches with you.... 
|
|
|
|
|
I want to create an array containing graphic GIF files (or pointers to the files) such that I can access and show the file with: document.write(array[gif1]);
I am new at Javascript. If there is something better than document.write, I'm open for suggestions.
Thanks,
Ray
|
|
|
|
|
So right now my countdown loop goes "5,4,3,2,1,"
Is there a way to add something so that when it goes to 1 there is no more comma?
Thank you! I am taking my first Javascript class so I apologize if my question is very basic.
|
|
|
|
|
|
You would have to show us the code you are currently using to do this. But my guess is you are just adding "," to some variable that is being decremented. So, just check if your variable is 1 first and if so, don't add the ","
There are only 10 types of people in the world, those who understand binary and those who don't.
|
|
|
|
|
Hello,
Just Check in Console it Works
var str,i,counter="";
for (i = 5 ; i >= 1; i--) {
str =i+',';
console.log(str);
counter+=str;
}
console.log(counter.replace(/.$/,""));
|
|
|
|
|
Greetings again gurus,
We are building a survey app for users.
The intent is to allow users to provide a feedback on the experience using the app.
The survey has six (6) questions and a comment box
Each question has four (4) choices.
The choices are 4 (for Excellent), 3 (for Good), 2 (for Fair), and 1 (for Poor).
Our requirement is to make the comment box either optional or mandatory depending on user choices.
For instance, if a user marks a radio button as Excellent or Good, then the comment box is optional; user does not have to enter any comments.
If however, a user checks a radio button for Fair or Poor, then we would like to make the comment box mandatory.
This forces the user to explain why his/her choice is either Fair or Poor.
Any ideas how to modify the code to make comment box mandatory or optional based on user's responses to the survey questions?
Below is the markup I am working with.
Thanks a lot in advance.
<script type='text/javascript'>
$(window).load(function(){
$(document).ready(function () {
$('#form1').validate({
rules: {
dept: {
required: true
},
location: {
required: true
},
surveydate: {
required: true
},
promptness: {
required: true
},
timleycompletion: {
required: true
},
courteousfriendly: {
required: true
},
cleanworkarea: {
required: true
},
issueresolved: {
required: true
},
performance: {
required: true
}
}
});
});
});
</script>
</head>
<body>
<form action="phpservices/process.php" id="form1" name="form1" method="POST">
<fieldset>
<legend style="font-weight:bold;color:firebrick;">Brief Survey Questions</legend>
<p style="font-weight:bold;color:#000000;">Promptness of response to service request:</p>
<div style="background:#ACD1E9;"><input type="radio" name="promptness" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="promptness" value="3"><label for="good">Good</label>
<input type="radio" name="promptness" value="2"><label for="fair">Fair</label>
<input type="radio" name="promptness" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:#000000;">Completed the work in a timely manner:</p>
<div style="background:#ACD1E9;"><input type="radio" name="timleycompletion" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="timleycompletion" value="3"><label for="good">Good</label>
<input type="radio" name="timleycompletion" value="2"><label for="fair">Fair</label>
<input type="radio" name="timleycompletion" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:#000000;">Courteous and friendly:</p>
<div style="background:#ACD1E9;"><input type="radio" name="courteousfriendly" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="courteousfriendly" value="3"><label for="good">Good</label>
<input type="radio" name="courteousfriendly" value="2"><label for="fair">Fair</label>
<input type="radio" name="courteousfriendly" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:#000000;">Kept the work area neat and clean:</p>
<div style="background:#ACD1E9;"><input type="radio" name="cleanworkarea" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="cleanworkarea" value="3"><label for="good">Good</label>
<input type="radio" name="cleanworkarea" value="2"><label for="fair">Fair</label>
<input type="radio" name="cleanworkarea" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:#000000;">Resolved the issue to my satisfaction:</p>
<div style="background:#ACD1E9;"><input type="radio" name="issueresolved" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="issueresolved" value="3"><label for="good">Good</label>
<input type="radio" name="issueresolved" value="2"><label for="fair">Fair</label>
<input type="radio" name="issueresolved" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:#000000;">Rate the overall performance of services provided:</p>
<div style="background:#ACD1E9;"><input type="radio" name="performance" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="performance" value="3"><label for="good">Good</label>
<input type="radio" name="performance" value="2"><label for="fair">Fair</label>
<input type="radio" name="performance" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:steelBLUE;"><label>Comment/Suggestion:</label></p>
<p><textarea name="comments" rows="2" cols="50"></textarea></p>
<input type="submit" value="Submit response >>" onClick="return validate(this.form);">
</fieldset>
</form>
</body>
</html><script type='text/javascript'>
$(window).load(function(){
$(document).ready(function () {
$('#form1').validate({
rules: {
dept: {
required: true
},
location: {
required: true
},
surveydate: {
required: true
},
promptness: {
required: true
},
timleycompletion: {
required: true
},
courteousfriendly: {
required: true
},
cleanworkarea: {
required: true
},
issueresolved: {
required: true
},
performance: {
required: true
}
}
});
});
});
</script>
</head>
<body>
<form action="phpservices/process.php" id="form1" name="form1" method="POST">
<fieldset>
<legend style="font-weight:bold;color:firebrick;">Brief Survey Questions</legend>
<p style="font-weight:bold;color:#000000;">Promptness of response to service request:</p>
<div style="background:#ACD1E9;"><input type="radio" name="promptness" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="promptness" value="3"><label for="good">Good</label>
<input type="radio" name="promptness" value="2"><label for="fair">Fair</label>
<input type="radio" name="promptness" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:#000000;">Completed the work in a timely manner:</p>
<div style="background:#ACD1E9;"><input type="radio" name="timleycompletion" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="timleycompletion" value="3"><label for="good">Good</label>
<input type="radio" name="timleycompletion" value="2"><label for="fair">Fair</label>
<input type="radio" name="timleycompletion" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:#000000;">Courteous and friendly:</p>
<div style="background:#ACD1E9;"><input type="radio" name="courteousfriendly" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="courteousfriendly" value="3"><label for="good">Good</label>
<input type="radio" name="courteousfriendly" value="2"><label for="fair">Fair</label>
<input type="radio" name="courteousfriendly" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:#000000;">Kept the work area neat and clean:</p>
<div style="background:#ACD1E9;"><input type="radio" name="cleanworkarea" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="cleanworkarea" value="3"><label for="good">Good</label>
<input type="radio" name="cleanworkarea" value="2"><label for="fair">Fair</label>
<input type="radio" name="cleanworkarea" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:#000000;">Resolved the issue to my satisfaction:</p>
<div style="background:#ACD1E9;"><input type="radio" name="issueresolved" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="issueresolved" value="3"><label for="good">Good</label>
<input type="radio" name="issueresolved" value="2"><label for="fair">Fair</label>
<input type="radio" name="issueresolved" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:#000000;">Rate the overall performance of services provided:</p>
<div style="background:#ACD1E9;"><input type="radio" name="performance" value="4"><label for="excellent">Excellent</label>
<input type="radio" name="performance" value="3"><label for="good">Good</label>
<input type="radio" name="performance" value="2"><label for="fair">Fair</label>
<input type="radio" name="performance" value="1"><label for="poor">Poor</label></div>
<br><br>
<p style="font-weight:bold;color:steelBLUE;"><label>Comment/Suggestion:</label></p>
<p><textarea name="comments" rows="2" cols="50"></textarea></p>
<input type="submit" value="Submit response >>" onClick="return validate(this.form);">
</fieldset>
</form>
</body>
</html>
modified 23-Jul-15 16:15pm.
|
|
|
|
|
According to this answer on SO[^], you just need to use a dependency expression[^]:
comments: {
required: "input:radio:checked[value='2'], input:radio:checked[value='1']"
}
The string value for the required rule is a jQuery selector which will be evaluated in the context of the form. The rule will only apply if the selector returns at least one element.
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
Hi Richard again!
Nice, very nice clean solution but I would like to make a slight change to the question if you don't mind sir.
Since there are six total questions, is it possible to have comment box for each question?
By default, hide the comments box.
If the choices are either 1 or 2, then show the comment box and make it mandatory.
If the choice is 3 or 4 keep the box hidden.
Can call this comments box rcomments.
Then we just have one global comments box for additional comments the user may have.
Is this possible?
Thanks so much (again) for your help.
|
|
|
|
|
Yes. You just need to set up a comment box for each question, with its own rule. The dependency expression would use the name of the radio buttons for the question - for example:
promptness-comments: {
required: "input:radio:checked[name='promptness'][value='2'], input:radio:checked[name='promptness'][value='1']"
}
You'd then just need a script to monitor the click event of each radio-button, and show or hide the relevant comment box. How you find the relevant comment box for the clicked radio button is up to you - I'd be inclined to use a predictable ID:
<textarea id="promptness-comments" name="promptness-comments" rows="2" cols="50"></textarea>
...
<script>
$(document).ready(function () {
...
$("#form1").on("click", "input:radio", function(){
var group = this.name;
var commentsId = "#" + group + "-comments";
$(commentdId).toggle(this.value === "1" || this.value === "2");
});
});
</script>
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
awesome, Richard.
Thanks very much.
|
|
|
|
|
how to add image in columns in datatables using jquery and json
|
|
|
|
|
It requires a lot of code and will be different for everyone's situation. Where are you stuck?
There are only 10 types of people in the world, those who understand binary and those who don't.
|
|
|
|
|
Ford Motor Company is accused of stealing Versata's Automotive Configuration Management (ACM) software. Versata is currently investigating this matter and is seeking information from individuals that formerly worked at Ford Motor Company on either the ACM program or on the replacement program called Product Definition Offering (PDO). If you previously worked on either one of these programs we would like to hear from you on a confidential basis at confidentialfordinfo@gmail.com.
We very much appreciate your response and are eager to hear from you.
|
|
|
|
|
I am sorry for the very basic question, but I don't have a reference book. Can you have more than one "Else if " statement in case you needed to make more than 2 comparisons to the same item?
|
|
|
|
|
Yes, you can.
You may also want to look at the switch statement[^] as well.
What do you get when you cross a joke with a rhetorical question?
The metaphorical solid rear-end expulsions have impacted the metaphorical motorized bladed rotating air movement mechanism.
Do questions with multiple question marks annoy you???
|
|
|
|
|
Member 11847850 wrote: I don't have a reference book
You don't need one, nearly all documentation[^] is online.
|
|
|
|
|
Could anyone let me know why my ajax program will not work? The code is below:
<!DOCTYPE html>
<html>
<head>
<script language = "javascript">
var XMLHttpRequestObject = false;
if(window.XMLHttpRequest)
{
XMLHttpRequestObject - new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHttp");
}
function getData(dataSource, divID)
{
if(XMLHttpRequestObject)
{
var obj = document.getElementById(divID)
XMLHttpRequestObject.open("GET", dataSource);
XMLHttpRequestObject.onreadystatechange = function()
{
if(XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200)
{
obj.innerHTML = XMLHttpRequestObject.responseText;
}
else
{
obj.innerHTML = Waitning for response...
}
}
XMLHttpRequestObject.send(null);
}
}
</script>
</head>
<body>
<div id="text">
<p>Response will appear here.</p>
</div>
<form>
<input type = "button" value = "Submit" onclick="getData('HelloWorld.php','divID')">
</form>
</body>
</html>
Thanks,
Truck35
|
|
|
|
|
Add a 'divID' in the body, e.g.
<div id="divID"></div>
|
|
|
|
|
I added the "divID" to the id attribute of the div tag and my program still will not work. If anyone has any ideas why, please let me know.
The modified code is below:
<!DOCTYPE html>
<html>
<head>
<script language = "javascript">
var XMLHttpRequestObject = false;
if(window.XMLHttpRequest)
{
XMLHttpRequestObject - new XMLHttpRequest();
}
else if(window.ActiveXObject)
{
XMLHttpRequestObject = new ActiveXObject("Microsoft.XMLHttp");
}
function getData(dataSource, divID)
{
if(XMLHttpRequestObject)
{
var obj = document.getElementById(divID)
XMLHttpRequestObject.open("GET", dataSource);
XMLHttpRequestObject.onreadystatechange = function()
{
if(XMLHttpRequestObject.readyState == 4 && XMLHttpRequestObject.status == 200)
{
obj.innerHTML = XMLHttpRequestObject.responseText;
}
else
{
obj.innerHTML = Waitning for response...
}
}
XMLHttpRequestObject.send(null);
}
}
</script>
</head>
<body>
<div id="divID">
<p>Response will appear here.</p>
</div>
<form>
<input type = "button" value = "Submit" onclick="getData('HelloWorld.php','divID')">
</form>
</body>
</html>
Thanks,
Truck53
|
|
|
|
|
change
obj.innerHTML = Waitning for response...
to
obj.innerHTML = "Waitning for response...";
use the dev tools of your browser, or a tool like Fiddler, to examine the network traffic. So if the request is being made and if so what its return status is. Maybe it's 404? or 500? We can't access your system so don't know.
|
|
|
|
|
Hello i am having an mp3 file i want to convert that audio file in byte array and send it to the server please let me know how i can do it
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
