Sign Up ›
  • Tech Enthu
  • NEWBIE
  • 0 Points
  • Member since 2012
  • Chatter
    Feed
  • 0
    Best Answers
  • 0
    Likes Received
  • 0
    Likes Given
  • 3
    Questions
  • 2
    Replies
2 replies

Issue with jQuery dialog with inputfield

I am trying to change JavaScript to jQuery but having some issues. Any help to resolve this issue is highly appreciated.

Thank you 


Scenario:
When user clicks on a custom link a prompt window(JavaScript) will show up  to capture phone number changes. The custom link and input hidden fields are with in my datatable so ids are not fixed. Now I would like to change this JavaScript functionality to jQuery but for some reason I am unable to show the input box on dialog to enter/modify the phone number.


VF:
<apex:dataTable align="center" cellspacing="1" value="{!contactlist}" var="contact" rendered="{!NOT(ISNULL(contactlist))}">
     <apex:column headerclass="ct" width="70px">
 <apex:facet name="header">Name</apex:facet>                                   
 <apex:inputfield id="Name" value="{!contact.Name__c}" style="width:70px;height:30px;text-align:right;" />
        <apex:commandlink value="Enter Phone" onClick="capturePhone('{!$Component.phone}');" />
    </apex:column>
    <apex:column>
    <apex:inputHidden id="phone" value="{!contact.phone__c}" />
    </apex:column>
</apex:dataTable>


JS:
<script language="JavaScript">
  function capturePhone(Phone){
     var newPhone=prompt("Please enter Phone",document.getElementById(Phone).value);
     if (newPhone !=null)
     {
       document.getElementById(Phone).value=newPhone;
     }
  }
</script>

 

jQuery:
 <head>
    <apex:includeScript value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.10.1.custom/js/jquery-1.9.1.js')}"  />
    <apex:includeScript value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.10.1.custom/js/jquery-ui-1.10.1.custom.min.js')}"  />
    <apex:stylesheet value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.10.1.custom/css/ui-lightness/jquery-ui-1.10.1.custom.css')}"  />
 <script>
   j$ = jQuery.noConflict();
    function capturePhone(Phone){
         var newPhone = document.getElementById(Phone);
       j$('<div id = Phone>').dialog( {
                                       
                                        modal: true,
                                        position: 'center' ,
                                        title: 'Enter the Phone',
                                        resizable: false,
                                        height:140,
                                        buttons : {
                                                   "Ok": function() {
                                                       j$( this ).dialog( "close" );
                                                    },
                                                   "Cancel": function() {
                                                       j$( this ).dialog( "close" );
                                                    } 
                                                   }
                                         });

       j$('<div id = Phone>').html(phone); -----Could be a problem?

       j$('<div id = Phone>').dialog("open");
        
    }
  </script>
 <head>

1 replies

Help with row and column totals and displaying them on visualforce page when a cell value changes

How can I calculate row, column totals  dynamically and show them on the screen?

 

I have a visualforce page which is dynamically generated[based on soql results] with N number of rows and columns like matrix grid and now I would like to add a static summary row and column at the end to display the row and column summaries respectively. Summary values should be generated whenever there is change to any cell value and/or also whenever user adds or delete a row. Could you please guide me with some sample code for both apex and vf page to accomplish this task?

 

Thank you very much in advance for all your help.

 

 

SOLVED
1 replies

SelectOption

How do I set selectoption value dynamically based on query results?

 

I have a single select picklist on my VF page with list values 1,2,3,4,5 and I would like to use this selectlist within datatable to read/write records to database. I am able to write the data to table but when I want to read the data the selectoption is not showing the stored value automatically[still showing the list to select one option]. For sure I must be missing something silly so I would like to request for an example with both controller and VF page code.

 

Thank you

2 replies

Issue with jQuery dialog with inputfield

I am trying to change JavaScript to jQuery but having some issues. Any help to resolve this issue is highly appreciated.

Thank you 


Scenario:
When user clicks on a custom link a prompt window(JavaScript) will show up  to capture phone number changes. The custom link and input hidden fields are with in my datatable so ids are not fixed. Now I would like to change this JavaScript functionality to jQuery but for some reason I am unable to show the input box on dialog to enter/modify the phone number.


VF:
<apex:dataTable align="center" cellspacing="1" value="{!contactlist}" var="contact" rendered="{!NOT(ISNULL(contactlist))}">
     <apex:column headerclass="ct" width="70px">
 <apex:facet name="header">Name</apex:facet>                                   
 <apex:inputfield id="Name" value="{!contact.Name__c}" style="width:70px;height:30px;text-align:right;" />
        <apex:commandlink value="Enter Phone" onClick="capturePhone('{!$Component.phone}');" />
    </apex:column>
    <apex:column>
    <apex:inputHidden id="phone" value="{!contact.phone__c}" />
    </apex:column>
</apex:dataTable>


JS:
<script language="JavaScript">
  function capturePhone(Phone){
     var newPhone=prompt("Please enter Phone",document.getElementById(Phone).value);
     if (newPhone !=null)
     {
       document.getElementById(Phone).value=newPhone;
     }
  }
</script>

 

jQuery:
 <head>
    <apex:includeScript value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.10.1.custom/js/jquery-1.9.1.js')}"  />
    <apex:includeScript value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.10.1.custom/js/jquery-ui-1.10.1.custom.min.js')}"  />
    <apex:stylesheet value="{!URLFOR($Resource.jQuery, 'jquery-ui-1.10.1.custom/css/ui-lightness/jquery-ui-1.10.1.custom.css')}"  />
 <script>
   j$ = jQuery.noConflict();
    function capturePhone(Phone){
         var newPhone = document.getElementById(Phone);
       j$('<div id = Phone>').dialog( {
                                       
                                        modal: true,
                                        position: 'center' ,
                                        title: 'Enter the Phone',
                                        resizable: false,
                                        height:140,
                                        buttons : {
                                                   "Ok": function() {
                                                       j$( this ).dialog( "close" );
                                                    },
                                                   "Cancel": function() {
                                                       j$( this ).dialog( "close" );
                                                    } 
                                                   }
                                         });

       j$('<div id = Phone>').html(phone); -----Could be a problem?

       j$('<div id = Phone>').dialog("open");
        
    }
  </script>
 <head>

8 replies

Addition of values in visualforce page level

hi

 

i am facing trouble while i want to add the values of displayed items .

For example :

 

 

1                2                         3  == 6

 

2                 3                        1 == 6

 

3                 1                         2  == 6

 

-----------------------------------------

6                6                          6

 

 

I am using group by clause for getting values.

 

my query :

 

Select Count(CaseNumber) tot1 , Product_Service_Category_Poc__c p1,Case_Type_Poc__c p2  from  Case where CreatedDate = THIS_WEEK and Status = 'open' group by Product_Service_Category_Poc__c,Case_Type_Poc__c