Update page as other instances of the same page changes in PHP - javascript

This is my question. I have a login for a user. Many users can log in with same credentials. When user/s log in, they see a set of radio buttons. Lets say User A, User B and User C log in at the same time. When User A selects some of the radio buttons, User B and User C should also see them selected in their pages. (and vice-versa) If User B changes a selected radio button again, User A and User C should get that updated value in their pages. Like this most recent selections should be visible in all pages. Please help me solve this.

I've done a similar setup awhile back, when user switches department view, all open pages of the application prompt him about the change and switch to the active department view.
I did it as follows.
Stored desired variables in user session. In your case, since you need this available across multiple users, session won't do - store it in a database or flat file. These variables are updated on radio onChange event in your case.
Make the following JS available to relevant pages. Note, I used onFocus since that was I needed, you may need to use setInterval()
window.onfocus = function(e) {
var_check();
};
function var_check(){
$.ajax({
url: 'home/check_vars_ajax',
type:'POST',
dataType: 'text',
data : {[YOUR DATA]}
}).done(function(data){
// ...
// handle selecting releavant radio buttons here
});
}
To summarize:
Write your radio selection to DB or flat file (via AJAX)
Setup a heartbeat call to check current status on the server (AJAX)
Update radio selection accordingly

Well another way to do it would be to go for WebRTC which basically allows you to screen share the users page and show the results on the other users or vice versa. It has very neat API and there are lot of samples that you can check out. Tutorials are available and their homepage itself is a good starting point
But with regard to your particular problem, I cannot give you a clear answers as the question itself is little broad(in my opinion). So check it out and hope it helps.

You can do it with a simple database query. How it works is, when someone logs into a page, it grabs a variable from a database row. At a set time, the page queries the database. if the value has changed in the database, update that row by one. the other pages will query at your set interval, and update the page with AJAX. It is a nifty way to update all pages at once. Here is a tutorial in this.
AJAX auto refresh
You can see a modified example on my request box on this page
AutoRoxx Radio
It is easily modified. Basics are there.

Related

Apex - Clear form when leaving page (also on redirect)

Currently, if I populate a form and leave the page, the form entries will still be present when I return to the form. Is it possible to prevent these entries from being saved?
The items' default values are populated using PS/SQL, but the content can be adjusted.
I tried creating a dynamic action to clear the items on 'Page Unload', but this didn't do anything. Is this the correct browser event, or did I simply get the implementation wrong?
Update: To provide a bit of context...
Pages:
Home
Form
DML Form (insert) - I want any modifications to not be stored
Page 3 can be accessed via Page 1 or Page 2.
If the user accesses the form via Page 2 (a different form), they will have selected a specific value and this is used to populate default values on Page 3 (via item and PL/SQL Function Body).
If the user accesses the form via Page 1, the same PL/SQL will run - this may result in Page 3 form items being empty (NULL default values).
HOWEVER, when the user edits Page 3 items (changing from default values), these values will persist when the user next accesses the form. How can I prevent this state from being captured?
You will need to clear the cache of the page. This will clear the session state of the items on the page and thus result in items being empty once again.
You may need to add this clear on several locations. If you have used column links to access the page, buttons with redirects, branches, etc. The apex URL has a part which states which pages have to be cleared, and you can generally define this clearing of a page cache declaratively.
You can also create processes where you can define which page (or pages) has to be cleared. For example, if you always want the cache to be cleared when entering the page, no matter where you came from, you could add a process on the page doing just that.
Session state is ultimately what is causing this behavior: go to the page, change some things, page gets submitted for whatever reason and causes session state to be saved.
Usually, on DML forms generated through the wizard, the cache would only be cleared when using the "create" button coming from another location (usually the overlying report).
Here is the (apex 5.0) documentation on session state and managing it.
You can do it with something like this, but first you need to add jQuery to your page. I recommend using a content delivery network (CDN). You can edit the code to clear the value in your type of forms. I hope this could help you!
jQuery CDN example
$(document).ready(function() {
$("body")
.find("input").val("")
.end()
.find("select").val("-")
.end()
.find("textarea").val("");
};
});

Local storage for events when click button X Close on window chat box?

I am a novice, now, I am learning HTML5.
I am buiding a window chat box using CSS. Now I want it to function like facebook'chatbox. Specificly, when I click the button "X" on the window chat box on tab1 it will also close on tab2,tab3,tab4,....tab n of the browser.
Also I would like it to operate the same for hiding the window.
I think I will need to use local storage for my problem, but don't know how to do it
Please help me !
Step 1: Create a database and some tables for it. You will definitely need a table where you store the users. You will need other tables to store user status. When a user is logged in, that user will be associated with the user table and the status table(s) having a foreign key to the user table.
Step 2: You need to develop a service on server-side which will handle post requests. These requests will either update the status or ask for the latest status.
Step 3: On client-side, you will need to do polling to repeatedly get the latest status.
Step 4: Whenever the status changes, refresh your UI components.
Step 5: Handle UI events. For instance, when you click on the x, a status update should be sent to the server that the tab needs to be closed. Other tabs will get the latest status when the next polling request gets a response and then the UI will be refreshed.
Easier said than done, but these are the steps you need to perform.

Restricting The Viewing of Forms Per User

Please could someone assist with the following:
I'm trying to restrict the viewing of forms using bootstrap and Meteor. In other words, user A logs in and creates a simple (or 2, or 3...) form using a modal which then displays in the html on a panel. How do I ensure that when user B logs in, he only sees his particular forms and not "user A's" forms?
I haven't included any code as I haven't started working on this problem as yet.
Thank you.
That's something you need to deal with using your publications/subscriptions. See here and here for learning ressources.
Basically, what should happen is that when user A creates a form (or any object), you store it into a collection along with the user id (Meteor.userId()). You subscribe to a publication in your page where you send only the items belonging to the current user Id.
That should solve your problem, and make you ready for all the similar (and common) cases where you need to disclose selected information only, depending on the context or the user. Moreover, it means that your users will be able to find back the items they left in their previous sessions.

Is it possible to use Javascript to temporarily store data while User adjusts, and then pass as Hash to Rails Controller?

At a high level, building an application that allows User to request Items from other Users located in the same county as the requesting User. User and Item are both models with associated databases.
On the request page, I'm trying to build 3 components.
1) A map that shows
A marker for each other User
When clicked on, the marker displays a popup that lists the Items that that User has. The requesting user can click on each Item to add it to the list of Items s/he would like to request
2) A set of search fields that allows the requesting user to filter the markers for Users and Items on the map, for example, perhaps by dates_available.
3) A "cart" (not literally since this is not about e-commerce) that shows the Items the requesting User has currently added, with a final submit button. Note, dates_available should not only be a search field, but also part of this Request
A not perfect example is this screenshot from Getaround:
I'm pretty new to coding in general, so always want to think through plugins, APIs, shortcuts, etc. The below is just for reference, but if you have comments on how to implement this better, PLEASE do tell me! Right now, I am currently thinking of using:
For the map:
Openlayers.org
Gmaps.js
For the search (which is really a filtering capability):
Ransack gem (https://github.com/activerecord-hackery/ransack)
THE KEY QUESTION
For the "cart" and the click Item to add to "queue" part, I realize that while I can do this in Rails purely, it might be less of a positive UX experience since the page would constantly re-render every time a new item were added, not to mention it'd potentially result in excessive pings to the database or records to be created. I'm thinking of using Javascript to basically make the "cart/queue" a staging area for temporary storage, where the User populates it with whatever Items s/he wants and edits as needed, but it's not until the final submit click that the entire group of Items is passed as a Hash to the Rails Controller to be saved.
Now, since I don't really know JS very well, any resources on how to do this (easy plug-in solutions, other considerations I may have missed) or if it's not possible (in which case pray tell) would be greatly appreciated.
Thanks!
You may try Javascript localStorage.
localStorage.myTempValue = "my temp value";
or
localStorage("key", "value");
You can store object:
var person = { name: "xxxxx", age: 35 };
localStorage.Person = person;
Hope my answer may trigger an idea in you!

Trigger an on-click overlay automatically once per user per ip

Like the title suggests, I have an overlay modal window on one of my websites. It fires every time a user clicks on a specific button. Am I able to somehow trigger that specfic button automatically once per user/ip so I can display that modal at least once for everyone, even if they don't click it? It's a good way to increase social-media fans and I noticed many websites are using this method. Is there any script that simply does that? I will provide code if necessarly although I don't see how it can help since this is more like a general matter.
Okay, looks like you want two things...
to trigger the modal to show regardless of whether the user clicks or not
window.load(function () {
//execute your modal popup here.
});
Note: You'll need JQuery for this.
to limit the window to only appearing once per user.
If your users are using a login, I'd suggest creating a new table for promos, possibly named, 'UserPromos' and create a bit field for this modal like, 'modalshown' and set it to false '0', for all users. Then, merely send that value to your page in a hidden input field, access that value from JS and if that value is '0' then show the modal with your script above and if it's '1' then don't.
Your server side code would update the value for the UserPromos.modalshown for that user in the db.
If your users are just visitors to the site, then you must use a JS cookie.

Categories

Resources