|
I want to use buttons in tree. So I used the article Working on JSON objects in jQuery and MVC given by Dr. Song Li in 24 Nov 2010. I have taken button instead of textnode. The buttons work fine first time. But these buttons do not fire after addExamBySession or addExamByjson is clicked.
var dateDeserialize = function (dateStr) {
var dt = new Date(parseInt(dateStr.substr(6)));
return prependZero((dt.getMonth() + 1))
+ "/" + prependZero(dt.getDate())
+ "/" + dt.getFullYear()
+ " " + prependZero(dt.getHours())
+ ":" + prependZero(dt.getMinutes())
+ ":" + prependZero(dt.getSeconds());
};
var FixDateinJson = function (JsonStudents) {
$.each(JsonStudents, function (i, JsonStudent) {
$.each(JsonStudent.ClassesTaken, function (i, JsonClass) {
$.each(JsonClass.ExamesTaken, function (i, JsonExam) {
JsonExam.ExamTime = dateDeserialize(JsonExam.ExamTime);
});
});
});
return JsonStudents;
}
var buildStudentTree = function (students) {
var createTextNode = function (text,id) {
var span = document.createElement("span");
span.setAttribute("style", "margin-left: 2px");
($('<input>').attr('type', 'button').attr('id',id)
.attr('value', text)).appendTo(span);
return span;
};
var root = document.createElement("ul");
root.id = "StudentTreeRoot";
root.setAttribute("style", "margin: 15px");
root.className = "filetree";
$.each(students, function (i, student) {
var studentNode = document.createElement("li");
studentNode.className = "closed";
var span = document.createElement("span");
span.className = "folder";
span.appendChild(createTextNode(student.Name, 's'+(i+1)));
studentNode.appendChild(span);
var classesNode = document.createElement("ul");
$.each(student.ClassesTaken, function (j, aClass) {
var classNode = document.createElement("li");
classNode.className = "closed";
span = document.createElement("span");
span.className = "folder";
span.appendChild(createTextNode(aClass.Name, 'c' + (i+1)));
classNode.appendChild(span);
var examesNode = document.createElement("ul");
examesNode.className = "folder";
$.each(aClass.ExamesTaken, function (k, aExam) {
var examNode = document.createElement("li");
examNode.className = "closed";
span = document.createElement("span");
span.className = "folder";
span.appendChild(createTextNode(aExam.Description, 'e' + (i + 1)));
examNode.appendChild(span);
var detailNode = document.createElement("ul");
var examTime = document.createElement("li");
span = document.createElement("span");
span.className = "file";
span.appendChild(createTextNode(aExam.ExamTime,'et'+(i+1)));
examTime.appendChild(span);
detailNode.appendChild(examTime);
var score = document.createElement("li");
span = document.createElement("span");
span.className = "file";
span.appendChild(createTextNode(aExam.Score, 'es'+(i+1)));
score.appendChild(span);
detailNode.appendChild(score);
examNode.appendChild(detailNode);
examesNode.appendChild(examNode);
});
classNode.appendChild(examesNode)
classesNode.appendChild(classNode);
});
studentNode.appendChild(classesNode);
root.appendChild(studentNode);
});
$("#StudentTree").html("").append(root);
$("#StudentTreeRoot").treeview();
};
$(document).ready(function () {
$("#StudentTree").html("");
$.ajax({
cache: false,
type: "POST",
async: false,
url: GetStudentsURL
+ "/?NoOfStudents=" + NoOfStudents
+ "&NoOfClasses=" + NoOfClasses
+ "&NoOfExams=" + NoOfExams,
dataType: "json",
success: function (students) {
StudentJson = FixDateinJson(students);
buildStudentTree(StudentJson);
}
});
$("#btnAddAnExamJson").click(function () {
$("#StudentTree").html("Loading ...");
$.ajax({
cache: false,
type: "POST",
url: AddAnExamByJsonURL,
contentType: 'application/json',
dataType: "json",
data: JSON.stringify(StudentJson),
success: function (students) {
StudentJson = FixDateinJson(students);
buildStudentTree(StudentJson);
}
});
});
$("#btnAddAnExamSession").click(function () {
$("#StudentTree").html("Loading ...");
$.ajax({
cache: false,
type: "POST",
url: AddAnExamBySessionURL,
dataType: "json",
success: function (students) {
StudentJson = FixDateinJson(students);
buildStudentTree(StudentJson);
}
});
});
$("#s1, #s2, #s3, #c1, #c2, #c3, #e1, #e2, #e3").click(function () {
alert($(this).attr('id') + ' Clicked');
$.ajax({
cache: false,
type: "POST",
dataType: "json",
success: function (students) {
StudentJson = FixDateinJson(students);
buildStudentTree(StudentJson);
}
});
});
});
</script>
</head>
<body>
<div id="TitleContainer"><%= ViewData["ApplicationTitle"]%></div>
<div id="MainContainer">
<div id="StudentTree"></div>
<div id="ButtonContainer">
<button id="btnAddAnExamSession" class="ButtonStyle">
Add an exam to students using session</button>
<button id="btnAddAnExamJson" class="ButtonStyle">
Add an exam to students by posting Json</button>
</div>
</div>
</body>
</html>
modified 22-Oct-15 1:18am.
|
|
|
|
|
If you are re-building the DOM then you have to re-attach the jQuery events to the new DOM elements you have created as the events were attached to elements that no longer exist. An alternative is to use "Delegated events" in jquery.
http://api.jquery.com/on/[^]
These won't perform well though.
|
|
|
|
|
Thank You For Your Valuable suggestion. By using bind() function it works correctly.
|
|
|
|
|
Ok I'm just a beginner and have an assignment. We are doing an order form where you add up the product amounts and come up with total cost using parseFloat for decimals. I can get the product amounts in decimals and it adds up right in the total cost, but the total cost does not come up with decimals and I cannot figure out why. Here is my js function code:
function total_price(){
var a = parseFloat(document.order.sub1.value);
var b = parseFloat(document.order.sub2.value);
var c = parseFloat(document.order.sub3.value);
var d = parseFloat(document.order.sub4.value);
var e = parseFloat(document.order.sub5.value);
var f = parseFloat(document.order.sub6.value);
var total = a + b + c + d + e + f;
document.getElementById("total").value = total;
}
This is my input tag (it's inside td tag:
<input class="numbers" id="total" onclick="total_price()" name="total" size="7" />
|
|
|
|
|
If your a,b,c,d,e,f, are integer values then the answer will be formatted as such too. You could try
document.getElementById("total").value = total.toFixed(2);
in the last line to force it to display to 2 decimal places.
|
|
|
|
|
Hello,
I am making an app that displays products. Once you select a product, it shows you links to purchase it, as well as 3 review videos from YouTube. So far I have used the YouTube API to display video information, including video ID, title, etc. But I am unsure as to how to display the videos themselves. Below is my JavaScript file that displays the video information.
Could anyone tell me how to display videos based on the product name?
Thank you!
function showResponse(response) {
var responseString = JSON.stringify(response, '', 2);
document.getElementById('response').innerHTML += responseString;
}
function onClientLoad() {
gapi.client.load('youtube', 'v3', onYouTubeApiLoad);
}
function onYouTubeApiLoad() {
gapi.client.setApiKey('API_KEY');
search();
}
function search() {
var request = gapi.client.youtube.search.list({
part: 'snippet',
q: "paper towel review",
maxResults: 2,
order: "viewCount"
});
request.execute(onSearchResponse);
}
function onSearchResponse(response) {
showResponse(response);
}
|
|
|
|
|
Dear all,
it's my simple JS program.
I can't figure out that why can't i stop the loop by using "guess==null".
Please help!!
var target = prompt("Please enter a number small than 50:");
var guess = "";
var time = 0;
do{
guess = prompt("Please Guess:");
if(guess == target || guess == null){
break;
}
if(guess < target){
alert("bigger!");
time++;
continue;
}else{
alert("smaller!");
time++;
continue;
}
}while(true)
if(guess==null){
document.write("the answer is:"+target);
}else{
document.write("Good!共猜了:"+(time+1));
}
|
|
|
|
|
Try using the isNaN[^] function - i.e.:
isNaN(guess)
rather than
guess == null
|
|
|
|
|
 really useful! thanks a lot!
|
|
|
|
|
guess can return an empty string when you click on Ok without entering anything, guess will only be null if you click on cancel or if you close the prompt.
Add guess == '' to your if statement or replace guess == null with isNaN(guess) that will check if the value is a legal number
|
|
|
|
|
 really useful! thanks a lot!
|
|
|
|
|
A few things that might be helpful.
You don't really need to test for the 'break' options (as your code appears) if you
do something like this:
do {
if(something is true) {
do-this;
}
else
if(something else is true) {
do this;
}
. . . etc . . .
else
break;
} while(true)
This style will handle anything 'unexpected' - that is, anything you didn't intend
| "The difference between genius and stupidity is that genius has its limits." - Albert Einstein | | "As far as we know, our computer has never had an undetected error." - Weisert | | "If you are searching for perfection in others, then you seek disappointment. If you are seek perfection in yourself, then you will find failure." - Balboos HaGadol Mar 2010 |
|
|
|
|
|
 really useful! thanks a lot!
|
|
|
|
|
/*
Dear all,
<script>
function Array2D(x,y){
this.length = x*y;
this.x = x;
this.y = y;
for(var i=0 ; i<this.length ; i++){
this[i] = null;
}
this.get = function(x,y){
return this[x*this.x+y];
}
this.set = function(x,y,value){
this[x*this.x+y] = value;
}
}
</script>
<script>
var a2d = Array2D(10,10);
a2d.set(2,3,"2");
alert(this.get(1,2));
</script>
Uncaught TypeError: Cannot read property 'set' of undefined
How does it happen?and what should i do to avoid this?
*/
|
|
|
|
|
It's undefined because you ahven't returned anything form your Array2D function. Try adding
return this;
at the end of it.
Also, your
alert(this.get(1,2));
shouold be
alert(a2d.get(1,2));
|
|
|
|
|
thanks a lot! it works! 
|
|
|
|
|
I need to check whether control id is available or visible (whether it is defined or undefined). how to check this process in javascript. any example pls
|
|
|
|
|
This code will check if an element exits with that ID:
if(document.getElementById(id)!=null)
{
}
You can use JQuery to check if the element is visible:
$('#MyID').is(':visible')
|
|
|
|
|
function validate()
{
var dd = document.frmreq;
if (mailid.value == "")
{ alert ("Pls enter mailid"); return false;
}
if (dd.description.value == "")
{
return false;
}
return true;
}
mailid and mobileno is get from DB
here, i can't able to get the mailid and mobileno for validation. any one explain me the problem here.
|
|
|
|
|
Use the getElementById method[^] to access the elements:
function validate()
{
var mailid = document.getElementById("mailid");
if (mailid.value === "")
{
alert("Please enter mailid");
mailid.focus();
return false;
}
var description = document.getElementById("description");
if (description.value === "")
{
alert("Please enter description");
description.focus();
return false;
}
return true;
}
"These people looked deep within my soul and assigned me a number based on the order in which I joined."
- Homer
|
|
|
|
|
Just taking my first javascript coding class and having a hard time with understanding all of it. Wanted to know what the main difference is in for and while loops and when it's best to use either one? Also want to know what the difference is between document.write and getElementById? Does it matter which one to use for output?
|
|
|
|
|
Member 11972043 wrote: Wanted to know what the main difference is in for and while loops and when it's best to use either one?
This is not something unique to JavaScript so I suggest you google for vs while loops and you'll see the difference. There's a subtle difference and most often depends on your preference to which one you use. W3Schools.com is a good resource. For example, see http://www.w3schools.com/js/js_loop_while.asp[^]
Member 11972043 wrote: Also want to know what the difference is between document.write and getElementById?
These cannot be compared to each other. document.write does what it sounds like. It calls the write method on the document. The document is the webpage so this can be used to write something on the page. I suggest not using it because you won't control, very well, where the output is. It's much better to put output into a control so that you can style it, position it, etc.
That's where getElementById comes in. It also does as it's name implies. It gets an element on your webpage by passing in the id of that element.
So, for example, if you wanted to do some output you could do something like this:
document.getElementById("myText").value = "Some Text";
Again, W3Schools.com, http://www.w3schools.com/jsref/met_doc_getelementbyid.asp[^]
There are only 10 types of people in the world, those who understand binary and those who don't.
|
|
|
|
|
The main difference between for and while is that (if you know how these conditional statements will work).
for is used to do a definite number of task i.e you know the limit for the process, say you want to print the number of anything in an array,etc.you can use counter to proceed further.
less interaction between user and machine.
while is same as for in some cases,you when the process will end but still in places like getting an input from the user which decides when the end should occur you have go with while.you can use you counters as well as boolean values.
i.e you can ask the user to whether continue or break after every successful process.interaction between the user and machine .
getelementbyid is used to get an input to a variable by using an id attribute from tag.
write is used to output the values assigned to it.
instead of this you can you use console.log().
sorry if it wasn't helpful because i'm new.
|
|
|
|
|
How can I add an image with a submit button but still show the words submit?
|
|
|
|
|
|
General 
News 
Suggestion 
Question 
Bug 
Answer 
Joke 
Praise 
Rant 
Admin 
Submit an article or tip
