Making get/post requests to bootstrap modals. How? - javascript

I am having a really difficult time trying to make a request and communicate with modals from other websites. For regular html you can see the hyperlink when hovering over the link or find out all about the element when inspecting, but with modals it seems like all the code is hidden on their website somewhere, making me unable to send http get/post requests correctly.
For ex when theres a button called "View containers" it opens up a modal and then theres a textarea field and a submit button. I know the ID of the text field, but there is like zero information on the submit button or where the submit button can lead to. I want to make a script that automatically sends a request , enter in the container # and clicks submit. But I dont know how to make the script click/send submit button

First, you'd want to change the input value
You can click buttons using the DOM click method after selecting it, probably using IDs
Additionally, I'd ensure the modal was put into the DOM before trying to insert values, or press submit...modals may not be inserted to the DOM until they are triggered/loaded.

Related

validation form, error message, submit button view

This is my first and most likely not the last question on stackoverflow. I need help, I have 2 popup windows, I need to validate data entry forms and display the text of the validation system error, but using js. Plus, you need to make the save and creat buttons so that they are not active if the form is not valid and vice versa.
I would appreciate your help!
https://codepen.io/andremoff/pen/zYLQOwN
At the moment, the error is displayed only on one popup window, the button works, but not quite correctly, since when opening the data is transferred to the form from the profile and initially they are valid, but the button is not active.

How to make pages progress stepwise on a popup?

Can someone please explain how can I go about creating the following page and what techniques should I adopt:
The user should be able to click on a button which should result in a popup.
The popup should have a static page with instructions and button to click which takes the user to the next step in the same popup.
At the next step the functionality should run to take input from the user and save it to the server.
The user should see a confirmation finally and on clicking finish, the popup should hide.
From what I understand, I should try the following:
use javascript onclick and fadeIn function to create the popup.
continue changing the same div using onclick and AJAX to create stepwise kind of a format and carry out the functionality.
use XMLHTTPRequest to upload data acquired and finally use fadeOut to hide the popup.
The reason why I am thinking in these lines is because I have had very little exposure to web designing and hence would love to get some expert views on if this is the right approach and if not then what should be a better way to do it. Is there is some existing literature/method which talks about it?
Any help would be much appreciated.
For first step
Use javascript onclick function. But before this keep your static content ready and than use jQuery UI to appear it as good Dialog Box. For example see this
For second step
The user will never know that you have changed the dialog. Just you can load new dialog with new content in it. When you click button on first page, make that first dialog box is closed.
For third step
Instead of static content make the response set to dialog, here you may use Ajax/post call.
Las step
Its not compulsion to use XMLHTTPRequest. You can even submit form in jQuery post/ajax. Than you can reload the page with confirmation message send in response from server or you may use jQuery to make the confirmation message appear.

How to disable buttons while server handles a request in RoR/JQuery

I have a page that is generated using RoR, JQuery and Bootstrap.
that page has three action buttons: edit, delete and disable.
The disable action changes the state of the entity and refresh the page.
The edit action sends the user to a form, where the user can edit the entity.
The delete action displays a confirm windows and if the users click Yes the entity is deleted.
What I am trying to do is to disable these buttons, while the server is handling the requests according to the action.
How can I do that? trying to use $(".btn").attr("disabled", "disabled") is not good enough because what happens if the user clicks on delete but then clicks on "No"? or when edit is being clicked but then the user decides to go back in history? in all these cases the buttons are still disabled.
Thanks.
You're using the wrong jQuery function., try:
$('#myInputId').prop('disabled', 1);
Elements attributes such as disabled and readonly require the prop() method and a boolean to change the state.
Regarding your jQuery AJAX request and creating a UX notification for the user, you can use the beforeSend option when building out your AJAX request to either show an AJAX spinning GIF or insert a message into the DOM.
Hope that helps!

submit button with no form filling

Hi i want a button to be shown on all my pages.
that code should be in such a way that no form filling is needed
the text on button will be "Problem? Click Here"
when click on button, it will be pressed and the person who has clicked cannot click again unless reload the page.
After the button is clicked the mail should be sent to admin with the exact link of page where button was clicked.
there should be no form to fill.
As for example facebook like button like the content meanwhile its pressed.
What should be the code for this? Any suggestion please?
Thank you
You can use an HTML button element with an onclick javascript function linked to it.
Since you don't want the button to work again until you have reloaded the page, you will need to do this through AJAX. This means you will have to send a request to the server, where, for instance, a PHP script will retrieve the page name from a GET variable and send the email to the administrator. The javascript part can keep track of the button being clicked once or not.
That should give you some pointers on where to start with your code. However, as stated in direct comments to your question, this site is not meant for asking for coding work to be done for you. Perhaps next time, try to think of a possible solution and ask for advice on your solution (improvements, coding conventions, etc)

Lotus Notes:Web page refresh restriction on attachment upload

I have a situation, in which I want to restrict my web page to refresh after I attach a document.
The secnerio is there is some hide when condition written on OnLoad of the Form using javascript, and as soon as the form loads the hide when is active but below that we have more hide when on the basis of selection of a drop down, that is also working, but if I attach a document the web page refreshes and the onload triggers, which further enables the first hide-whne and then again I have to select from drop-down to enable the next hide-when.
Please help if we can restrict web-page refresh after attachment upload.
It sounds like the problem might be more that you have to re-select the drop-down to get the hide-when on that to work after a refresh ? That is, the value is already selected, so there's no change, so the hide-when isn't triggered ?
If so, you probably need to package up the drop-down's hide-when code into a function (if it isn't aleready) and always call that during onload so that if the page refreshes, all hide-when is honoured.
That's assuming the hide-when resulting form the drop-down change is also in Javascript. If it isn't and you have "Refresh fields on keyword change" ticked in the Notes Designer field's properties, then that's what's causing the second refresh, and your best best would be to un-tick that peoperty and simulate the resulting hide-when using javascript, with an onchange event on the drop-down.

Categories