dynamically update page with a users selection? - javascript

My question is what language is required if I had a sign up form in a dialog box, and depending on my users input, have the page update with the selection? For instance, a user would sign up and a pop up box asks to upload picture and select a few inputs and the background is dynamically updated with the user's selection. I know jquery and ajax of course has to be involved but is there any others? I have tried to google this but i have no luck.
example: https://twitter.com/signup
As you are signing up they give you a selection and if you choose one it dynamically updates the background. Forgive me if my question is vage.

in adidtion to jQuery you will likely want to use a plugin for a rich lightbox. I recommend the jQuery colorbox plugin
Here are some other options

Related

How to select an item from a drop down menu on a website that's coded with an html input text object?

I'm trying to build a Chrome Extension that autofills a website form. The form has several drop down menus. However, these are not coded with the HTML select object. Instead, they're coded with the HTML input text object (see the attached photo) (https://i.stack.imgur.com/6FynG.png).
I'd like to build functionality that mirrors selectedIndex and select one of the drop down menu items.
Is this possible?
I've tried 3 things:
I've used .execCommand to mimic the user typing into the input box to narrow down the number of drop downs that appear. This isn't a complete solution because the user must still click on the drop down menu.
I've used .innerHTML and similar methods to change the websites HTML, so that it matches the output of when a user selects an option from the drop down menu. This makes the website look like the user has selected an option, but it doesn't full work either. As soon as the user clicks outside of the input field, the field revers back to being empty (maybe the form is refreshing?)
I've explored using Selenium, but I don't think it makes much sense here. I'm trying to build a Chrome Extension for other users, rather than automate testing.

Advanced Custom Fields - Toggleable Options for the Backend?

I'm building a website using the ACF plugin (Version 5 Pro), and I'm setting up a button on a page template, which by itself isn't the problem. The problem is that depending on the specific content of each individual page using that template, the button can have one of several different appearances. What I'm trying to do is set things up so that I can upload all the buttons into the default value section of the ACF field ahead of time, and then every time I make a new page using that template, simply select the appropriate button from a radio button, a dropdown menu, or something similar on the backend of the page. I plan to be constantly uploading small amounts of content using this template, so not having to manually select the appropriate images on each page would save me a lot of time.
I've googled around and there wasn't a good answer I could find anywhere, so I'm hoping one of you more knowledgeable folks could help me out!
(And before anyone proposes this as a solution, no, the content of each page isn't something I can define just using programming. It's a little more abstract and needs human input. If all else fails I can just make multiple templates and simply select the appropriate one when I go to make a page, but the way I'm trying to do it now would be a lot cleaner).
You can try ACF Flexible Content:
https://www.advancedcustomfields.com/add-ons/flexible-content-field/
Using Flexible Content field, you will be able to create multiple fields (button 1, button 2, etc) including a WYSIWYG editor and build the buttons HTML adding the default value of the field.
You can read:
https://support.advancedcustomfields.com/forums/topic/html-default-values/
However, I think you'll get in trouble making your buttons dynamic with this approach... so I'd suggest it will be better if you keep some parts of the buttons (like URLs) dynamic, using an extra field to enter the URL, anchor, etc.

How to create a checkbox into a confirm dialog using only jquery?

I wonder if there is a way to create some checkboxes into a dialog (such as confirm or alert) with no intervention of HTML code, I mean, create a dialog with YES and NO buttons and checkboxes only with Javascript, which appears clicking a link.
Thanks.
Example:
http://i.stack.imgur.com/7VnOW.png
EDIT
The result would show:
a dialog with buttons (OK, CANCEL), and various checkboxes
user cannot select more than 5 checkboxes, but at least one
once user select options and click OK, will send text strings corresponding to checkboxes selected. Example: "check1|check4|check7".
You can achieve this by using an external library such as Jquery UI or even Twitter Bootstrap. You can create a modal dialog and embed every input type you want in it. Take a look to the JQuery UI docs, it might help. http://jqueryui.com/dialog/

how can i fill text into facebook plugin comment by clicking the button using javascript

Is there a method to fill the textfield from a Facebook comment plugin using javascript?
I know how to fill the text into textbox of website using active control by javascript, but it doesn't seem to work on the Facebook comment plugin.
eg. if I click the hello button I want to fill the active textbox text with "hello".
You will need to make sure that you execute your action after the textfield appears in your UIWebView. However, I will highly recommnend making a delegate method instead, detecting the facebook button click, and use the Facebook SDK instead.
Much more freedom instead of having to "hijack" the html and manipulate it after load.

html look up field

How to create an html look up field. So, I want to achieve
an html input field, with an icon/button next to it
when user click on it, a pop-up window displays with a search form (I assume this can be created beforehand and hide using javascript)
user apply search, and data is displayed in the same (pop-up) window
when user select a value and apply ok, the field value is copied to the original input filed, and pop-up window closes.
Any sample code? Is there any simple way without using any java script library? or any simple plugin for jquery.
thanks.
It would be possible, but very unwise to do this without any libraries or plug-ins.
I strongly recommend jQuery UI's Dialog widget. It's very simple, well documented and easy to use.
You will probably be interested specifically in how to use the Dialog to display a form. Click the View Source link on that page to see all of the mark-up and code required to achieve that effect.

Categories

Resources