?
Solved

javascript or jquery

Posted on 2011-09-22
11
Medium Priority
?
532 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
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 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 16

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
Certified OpenStack Administrator Course

We just refreshed our COA course based on the Newton exam.  With 14 labs, this course goes over the different OpenStack services that are part of the certification: Dashboard, Identity Service, Image Service, Networking, Compute, Object Storage, Block Storage, and Orchestration.

 
LVL 16

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
 
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 16

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 16

Author Comment

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

Assisted Solution

by:jmnf
jmnf earned 1000 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 1000 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

Optimize your web performance

What's in the eBook?
- Full list of reasons for poor performance
- Ultimate measures to speed things up
- Primary web monitoring types
- KPIs you should be monitoring in order to increase your ROI

Question has a verified solution.

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

This is an updated version of a post made on my blog over 3 years ago. It is unfortunately, still very relevant as we continue to see both SQLi (SQL injection) and XSS (cross site scripting) attacks hitting some of the most recognizable website and …
Sometimes databases have MILLIONS of records and we need a way to quickly query that table to return the results me need. Sure you could use CFQUERY but it takes too long when there are millions of records. That is why SOLR was invented. Please …
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…
Suggested Courses

762 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