Solved

Calling PHP Function from Javascript - Ext-JS

Posted on 2010-08-24
5
1,567 Views
Last Modified: 2012-05-10
Hi Experts,

I have a JS file that is a login form which calls a PHP login script and returns true or false results however what I need is to manipulate the JS script to call a specific function called authenticate within the PHP script.  Below is the specifi piece of code that calls the PHP script and the change is required.  I have also included the entire JS script as well.  can you help?

buttons:[{
            
                text:'Login',
                formBind: true,       
                // Function that fires when user clicks the button
                handler:function(){
                    login.getForm().submit({
                        method:'POST',
                        waitTitle:'Connecting',
                        waitMsg:'Validating Identity...',
Ext.onReady(function(){

    Ext.QuickTips.init();

 

var login = new Ext.FormPanel({ 

//id: 'login-form',

bodyStyle: 'padding:15px;background:transparent',

border: true,

url:'login.php',

title:'Please Login',

frame:true,

defaultType:'textfield',

monitorValid:true,



items: [{

xtype: 'box',

autoEl: { tag: 'div',

html: '<img src="/extjs/qis_logo_small.png" class="app-img" /><br><br/>'}

},



{ xtype: 'textfield', id: 'userid',

fieldLabel: 'Userid',

allowBlank: false, blankText: 'userid is required', minLength: 3,

msgTarget:'side'

},



{ xtype: 'textfield', id: 'password',

fieldLabel: 'Password',

inputType: 'password',allowBlank: false, blankText: 'Password is required', minLength: 6,

msgTarget:'side'

}],



buttons:[{ 

		

                text:'Login',

                formBind: true,	 

                // Function that fires when user clicks the button 

                handler:function(){ 

                    login.getForm().submit({ 

                        method:'POST', 

                        waitTitle:'Connecting', 

                        waitMsg:'Validating Identity...',



						

 

			// Functions that fire (success or failure) when the server responds. 

			// The one that executes is determined by the 

			// response that comes from login.asp as seen below. The server would 

			// actually respond with valid JSON, 

			// something like: response.write "{ success: true}" or 

			// response.write "{ success: false, errors: { reason: 'Login failed. Try again.' }}" 

			// depending on the logic contained within your server script.

			// If a success occurs, the user is notified with an alert messagebox, 

			// and when they click "OK", they are redirected to whatever page

			// you define as redirect. 

 

                       						

						success:function(){ 

                        	Ext.Msg.alert('Status', 'Login Successful!', function(btn, text){

				   if (btn == 'ok'){

		                        var redirect = 'home.php'; 

		                        window.location = redirect;

                                   }

				   

			        });

                        },

 

			// Failure function, see comment above re: success and failure. 

			// You can see here, if login fails, it throws a messagebox

			// at the user telling him / her as much.  

 

                        failure:function(form, action){ 

                            if(action.failureType == 'server'){ 

                                obj = Ext.util.JSON.decode(action.response.responseText); 

                                Ext.Msg.alert('Login Failed!', obj.errors.reason); 

                            }else{ 

                                Ext.Msg.alert('Warning!', 'Authentication server is unreachable : ' +                                 action.response.responseText); 

                            } 

                            login.getForm().reset(); 

                        } 

                    }); 

                } 

            }] 

    });

//Ext.onReady(function() {

 var win = new Ext.Window({

    layout: 'form',

    width: 340,

    autoHeight: true,

    closable: false,

    moveable: true,

    border: false,

	resizable: false,

    items: [login]

});

    win.show();

});

Open in new window

0
Comment
Question by:Tbone3434
  • 2
  • 2
5 Comments
 
LVL 34

Expert Comment

by:Beverley Portlock
ID: 33516587
You need to read up on AJAX and the XMLHttpRequest object

http://en.wikipedia.org/wiki/XMLHttpRequest

It might be easier to use a framework and one that is developed specifically for PHP is SAJAX  http://sajax.info/
0
 
LVL 3

Expert Comment

by:SuchetaL
ID: 33518266
Is it when the form is submitted you want to call a specific PHP function say authenticate?

That is something you will have to manage in your PHP code. You can pass a hidden value in your form. This hidden value will help you decide which function to call from your submit script.


Hope that helps
Sucheta
0
 

Author Comment

by:Tbone3434
ID: 33523785
Yes it is when the form is submitted that I want to call the authenticate function within the PHP script.
0
 
LVL 3

Accepted Solution

by:
SuchetaL earned 500 total points
ID: 33528175
So, in your form add a hidden field -
<input type="hidden" id="function_to_call" name="function_to_call" value="a"/>


In your PHP script where your form is submitted - thats login.php

Check -
    if($_POST["function_to_call"] == "a") {
          // call authenticate function
         return authenticate();
    } else {
        // If you have other options ... they are called from here
    }
         
0
 

Author Closing Comment

by:Tbone3434
ID: 33532381
That was exactly what I needed...Thank You!
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Part of the Global Positioning System A geocode (https://developers.google.com/maps/documentation/geocoding/) is the major subset of a GPS coordinate (http://en.wikipedia.org/wiki/Global_Positioning_System), the other parts being the altitude and t…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
This tutorial will teach you the core code needed to finalize the addition of a watermark to your image. The viewer will use a small PHP class to learn and create a watermark.
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)

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

16 Experts available now in Live!

Get 1:1 Help Now