Solved

javascript or jquery

Posted on 2011-09-22
11
524 Views
Last Modified: 2012-05-12
Hi, I have the following code a mixture of jquery and javascript and i want that when i click my button, it calls the function onClick event and i want the error message to appear for 2 seconds and should hide, but currently they are not doingas such

function mydata(frmname)
{
	  var r = $("select#reasonName").val();
	  if($('#pList').is(':empty')) {
		  $("span#error").show().delay(2000).queue(function(n) {
	    	  $(this).hide(); n();
	      });
	  }
	  else if (r == 0) {
		   $("label#mylabel_error").show().delay(2000).queue(function(n) {
			   $(this).hide(); n();
		   });
	      $("select#reasonName").focus();
	      	return false;
	  }
	var lstProjects = document.getElementById("mylist").value;
	var reasons = document.getElementById("reasonName").value;
	ColdFusion.navigate('abc.cfm?ID='+mylist+'&rs='+reasonName,'div','','');
} 

Open in new window


In front end i am showing the error in the Span and the Label tags whose display:none; has been set initially

So pleae guide what is wrong in this
0
Comment
  • 6
  • 4
11 Comments
 
LVL 4

Expert Comment

by:jmnf
ID: 36581609
I believe this is what you're looking for...

// Show dialog on some event
showDialog();

// Close dialog on same event right after opening using setTimeout
setTimeout(hideDialog(), 2000);

// this goes in your javascript block
function showDialog(){
    $( "#dialog" ).dialog();
}

function hideDialog() {
    $("#dialog").dialog({
        hide: "fadeOut"
    });
}

Open in new window


Hope it helps
0
 
LVL 15

Author Comment

by:Gurpreet Singh Randhawa
ID: 36581761
well do not where do i place my other calls
0
 
LVL 4

Expert Comment

by:jmnf
ID: 36582039
Try this, backup current "function mydata(frmname)" and replace the "if" statement inside it with this one:

if($('#pList').is(':empty')) {
    setTimeout(function() {
        $("span#error").dialog();
    },2000);
}
else if (r == 0) {
    setTimeout(function() {
        $("label#mylabel_error").dialog();
    },2000);
    $("select#reasonName").focus();
    return false;
}

Open in new window

0
 
LVL 15

Author Comment

by:Gurpreet Singh Randhawa
ID: 36582339
but i need that mydata code also, i know this will work, i need implementation with that that

Regards
0
 
LVL 4

Expert Comment

by:jmnf
ID: 36582508
function mydata(frmname)
{
    var r = $("select#reasonName").val();

    if($('#pList').is(':empty')) {
        setTimeout(function() {
             $("span#error").dialog();
        },2000);
    }
    else if (r == 0) {
        setTimeout(function() {
            $("label#mylabel_error").dialog();
        },2000);
        $("select#reasonName").focus();
        return false;
    }

    var lstProjects = document.getElementById("mylist").value;
    var reasons = document.getElementById("reasonName").value;
    ColdFusion.navigate('abc.cfm?ID='+mylist+'&rs='+reasonName,'div','','');
}
0
3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

 
LVL 4

Expert Comment

by:jmnf
ID: 36582900
Forgot to enclose it on code, BTW you probably need to use "lstProjects" instead of "mylist" and "reasons" instead of "reasonName" inside of your Colfusion.navigate function
0
 
LVL 15

Author Comment

by:Gurpreet Singh Randhawa
ID: 36586882
i get this issue

$("span#error").dialog is not a function
0
 
LVL 4

Expert Comment

by:jmnf
ID: 36587913
My bad...

dialog() is a function in jQuery UI, not only is jQuery needed, bu also jQuery UI... you can download it from the site:

http://jqueryui.com/download

or load it from google CDN:

http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js

and here's the dialog() documentation page:

http://jqueryui.com/demos/dialog/

0
 
LVL 15

Author Comment

by:Gurpreet Singh Randhawa
ID: 36588217
i do not want the dialog UI
0
 
LVL 4

Assisted Solution

by:jmnf
jmnf earned 250 total points
ID: 36588844
Okay... jQuery but no UI:

function mydata(frmname)
{
    var r = $("select#reasonName").val();

    if($('#pList').is(':empty')) {
        setTimeout(function() {
            $("span#error").css({'display':'none'});
        }, 2000);
    else if (r == 0) {
        setTimeout(function() {
            $("label#mylabel_error").css({'display':'none'});
        }, 2000);
        $("select#reasonName").focus();
        return false;
    }
    var lstProjects = document.getElementById("mylist").value;
    var reasons = document.getElementById("reasonName").value;
    ColdFusion.navigate('abc.cfm?ID=' + lstProjects + '&rs=' + reasons, 'div', '', '');
}

Open in new window

0
 
LVL 75

Accepted Solution

by:
Michel Plungjan earned 250 total points
ID: 36589794
http://api.jquery.com/delay/

Added to jQuery in version 1.4, the .delay() method allows us to delay the execution of functions that follow it in the queue. It can be used with the standard effects queue or with a custom queue. Only subsequent events in a queue are delayed; for example this will not delay the no-arguments forms of .show() or .hide() which do not use the effects queue.


function mydata(frmname) {
  if($('#pList').is(':empty')) {
    $("span#error").show();
    setTimeout(function() {$("span#error").hide();}, 2000);
    return false;
  }
  var r = $("select#reasonName").val();
  if (r == 0) {
    $("label#mylabel_error").show();
    setTimeout(function() {$("label#mylabel_error").hide();}, 2000);
    $("select#reasonName").focus();
    return false;
  }
  var lstProjects = $("#mylist").val();
  var reasons = $("#reasonName").val();
  ColdFusion.navigate('abc.cfm?ID=' + lstProjects + '&rs=' + reasons, 'div', '', '');
}

Open in new window

0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

I spent nearly three days trying to figure out how incorporate OAuth in Coldfusion for the Eventful API. Hopefully, this article will allow Coldfusion Programmers to buzz through the API when they need to. Basically, what this script does is authori…
International Data Corporation (IDC) prognosticates that before the current the year gets over disbursing on IT framework products to be sent in cloud environs will be $37.1B.
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now