+ Start a Discussion
Dale WorthingtonDale Worthington 

Ask a question with jquery when record is opened

Hi There

I want to have a question presented to the user if a field is blank. I understand that ill need a VF page on the record which calls a jquery popup where the user can make the section. The popup would only show if 'field1' is blank, if the users selects yes then it would write yes to field 1, if they select no then it will write no to field 1. I will need to add an if statement to the start of the script.

So far i have made a VF page and put it on the opportunity however the VF page just displays the script in text, it does not execute it. At this stage im just trying to make the popup appear. 

This is a mashup of some scripts if found on here. Any help is appreciated. 

 
<apex:page StandardController="Opportunity">


    <script type="text/javascript" src="/js/functions.js"></script>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
	<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>

window.document.onload = new function(e)
<script>
try{
  jQuery(function() {
    /*Append the jQuery CSS CDN Link to the Head tag.*/
    jQuery('head').append('<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/start/jquery-ui.css" type="text/css" />');
    
    /*Create the HTML(DIV Tag) for the Dialog.*/
    var html = 
      '<div id="dialog" title="Question 1 Title"><p>Question 1</p>Some supporting test.</div>';
    
    /*Check if the Dialog(DIV Tag) already exists if not then Append the same to the Body tag.*/
    if(!jQuery('[id=dialog]').size()){
      jQuery('body').append(html);
    }    

    /*Open the jQuery Dialog.*/ 
    jQuery( "#dialog" ).dialog({
      autoOpen: true,
      modal: true,
      show: {
        effect: "highlight",
        duration: 1000
      },
      hide: {
        effect: "fold",
        duration: 200
      },
      buttons: {
        "Yes": function() {
          location.replace('/home/home.jsp');
          jQuery( this ).dialog( "close" );
        },
        "No": function() {
          location.replace('/home/home.jsp');
          jQuery( this ).dialog( "close" );
        },
        Cancel: function() {
          jQuery( this ).dialog( "close" );
        }
      }
    });
  }); 
}
catch(e){
alert('An Error has Occured. Error: ' + e);
}
</script>

</apex:page>

 
Prateek Singh SengarPrateek Singh Sengar
Hi Dale,
You <script> tag (line # 9) should be before the windows.document.onload call. All javascript & jqueries should be inside <script> tags. Hope this helps.
Dale WorthingtonDale Worthington
Hi PrateekSinghSengar,

I have moved the <script> from 9 to 7. While the text is no longer output there is no script running at all now. 
Prateek Singh SengarPrateek Singh Sengar
Hi Dale,
I have a similar code that you can modify
 
<script>
    // jquery funtion for pop up.
     $(function () {
     $('#a').click(function(){
        $( '<div></div>' ).dialog({
            resizable: false,
            height:140,
            modal: true,
            open: function() {
                 var markup = 'Are You Sure?';
                 $(this).html(markup);
            },
            title: "Confirmation",
            buttons: {
                "Yes": function() {
                    $( this ).dialog( "close" );
                    yesFunction();
                },
                "No": function() {
                    $( this ).dialog( "close" );
                }
            }
        });
       });
     });
    
    function yesFunction(){
        // Write you code/logic of js here...
        alert("call your logic.");
    }
</script>

Please note that the above code is tied to a button with id "a", replace this with button in your page.
 
<apex:form>
<h4>Click on Button for custom pop up. </h4>
// Button.
<div id="a" class="btn">
Ok
</div>
</apex:form>
Hope this helps
Dale WorthingtonDale Worthington
I will have a look at this tomorrow. My concern with this is that a button still needs to be pressed but in my case i need this to come up when the page is loaded.

Thanks :)