moosey_man1988 Posted December 16, 2015 Share Posted December 16, 2015 Hi Peeps So basically im creating a "customer page" i have 2 tabs, 1 is customer info which is the primary and the invoicing tab I have a date picker in the invoicing tab which im hoping will populate a table below. I tried having the form post to php but this resets the page which then goes to the customer info tab so im guessing this will have to be done with jquery and ajax. could someone please point me in the right direction to do this? here is the current page for better explanation: All help is greatly appreciated in advance Mooseh Quote Link to comment Share on other sites More sharing options...
benanamen Posted December 16, 2015 Share Posted December 16, 2015 Pictures are for hanging on the wall. Post your code. Quote Link to comment Share on other sites More sharing options...
moosey_man1988 Posted December 16, 2015 Author Share Posted December 16, 2015 there is no code yet, I first need to know whether im correct in saying this needs to be jquery / ajax for it not to affect the tab on update, and I also need pointing in the right direction for something like this :± ajax and jquery are a weakness to me. Quote Link to comment Share on other sites More sharing options...
mac_gyver Posted December 16, 2015 Share Posted December 16, 2015 javascript/ajax/jquery is not required to make the client/server functionality for a web page. they are used to add to the presentation of the web page. you should get your client-side and server-side code to work first (even to the point of it working with javascript disabled), because you will need all the same html markup and php code, with or without using javascirpt/ajax/jquery. your two tabs are just two 'views' that are present on the web page. when you pick/enter a date in your form field and submit the form, which should be a get method form since you are determining what the page will display, it should submit any existing get parameters as hidden form fields, along with the date. the server side code should then use the submitted get parameters and retrieve any data for the two views, produce the two sections of output for the page, then produce the complete html document and send it to the browser. once you get all the program logic in place and working, then add things like displaying the output in tabs, adding a date picker to populate the form field, using events to submit forms, using ajax to send data to the server and display the result, ... Quote Link to comment Share on other sites More sharing options...
Solution Ch0cu3r Posted December 16, 2015 Solution Share Posted December 16, 2015 I tried having the form post to php but this resets the page which then goes to the customer info tab so im guessing this will have to be done withjquery and ajax. Doesn't have to be. If the the form is submitting to itself then in the forms action add a hash, eg <form action="#invoice" method="post"> ... form ields ... </form> When the page loads, in javascript use window.location.hash to get the hash value, it it is equal to #invoice then have the invoice tab be the active tab rather than the customer tab. Judging by your screenshot you are possibly using Bootstrap tabs component? Looking at the documentation you should be able to call the .show() method on your invoice tab to set as active, eg if(window.location.hash == '#ivoice') { $('#invoiceTabIdHere').tab('show'); // should make the invoice tab active } Quote Link to comment Share on other sites More sharing options...
moosey_man1988 Posted December 17, 2015 Author Share Posted December 17, 2015 perfect! so i can just use PHP for the command and use this javascript to keep the 2nd tab open that was simpler than i previous thought thanks guys Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.