javascript or jquery

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
LVL 16
Gurpreet Singh RandhawaWeb DeveloperAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
Michel PlungjanConnect With a Mentor IT ExpertCommented:
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
 
jmnfCommented:
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
 
Gurpreet Singh RandhawaWeb DeveloperAuthor Commented:
well do not where do i place my other calls
0
Get your problem seen by more experts

Be seen. Boost your question’s priority for more expert views and faster solutions

 
jmnfCommented:
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
 
Gurpreet Singh RandhawaWeb DeveloperAuthor Commented:
but i need that mydata code also, i know this will work, i need implementation with that that

Regards
0
 
jmnfCommented:
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
 
jmnfCommented:
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
 
Gurpreet Singh RandhawaWeb DeveloperAuthor Commented:
i get this issue

$("span#error").dialog is not a function
0
 
jmnfCommented:
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
 
Gurpreet Singh RandhawaWeb DeveloperAuthor Commented:
i do not want the dialog UI
0
 
jmnfConnect With a Mentor Commented:
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
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.