Develop Reference

How do i change the Action attribute in a form field? HTML

Im currently working on a web application, where i need to be able to take a picture in a browser using a mobile device.
I'am currently able to upload this picture to my storage on googlecloud, but i am having some troubles with the URL of said picture. The URL of the picture is defined in an action(HTML attribute). And im struggling to see how this action field can be dynamic.
It seems i cant put in the variable name for my URL in the action field.
Is there any other way to do this?
Im sorry in advance for my bad english.
<form id="BilleddeUpload" action="url" method="POST" enctype="multipart/form-data">
<input type="file" accept="/*" name="file">
<button>Submit</button>
</form>
<script>
function gogogoogle(){
var billedenavn = document.getElementById("BilledeUpload");
var url = "https://storage.googleapis.com/notgonnaputreallinkhere/"
+ prompt("Insert picture name here.");
billedenavn.action=url;
}
</script>
<p>Billede på google cloud </p>
<button onclick="gogogoogle()">
Hvad skal den hedde????
</button>

You already have defined a variable to hold a reference to the form billedenavn.
This line
var billedenavn = document.getElementById("BilledeUpload")
and a few lines later you wrote
document.getElementById("BilledeUpload").action = url;
which contains a typo in the form ID. But why not directly write:
billedenavn.action = url;

their is some syntax error.
put function [and it's body] into script tag,
and change form id from BilleddeUpload to BilledeUpload.

Dynamically submit form and show the value of the input without reloading

I want to create a fully dynamic chat UI for my website,
But it reloads the whole page if a person submits the button this will directly show the div
<div class="messeging" id="msg">
<?php print $message->getName() ." : " . $chat->message . ""; ?>
</div>
Without reload msgs are save in some xml file path like example (../user/xml)
HTML
<form action="action.php" method="post">
<input type="text" id="input" value="php echo">
<input type="submit" value="send" onclick="showDiv()">
</form>
<div class="messeging" id="msg">
<?php print $message->getName() ." : " . $chat->message . ""; ?>
</div>
i don't know javascript/ajax well how to solve this

Try jquery ajax, on submit button send last msg for save into db and fetch all record and show them into chat page. so each time you send msg it will fetch all msg. if you don't know about how ajax work then let me know.

Begin by looking at the event on forms called 'onSubmit'. https://developer.mozilla.org/en-US/docs/Web/API/GlobalEventHandlers/onsubmit
Once you understand that, you can 'event.preventDefault()' in your 'onSubmit' method handler. Or in English, keep a form's default behavior to submit to the action from occurring.
After preventing the default action, you will need to do something with the form, and the easiest in latest browsers is to use the fetch API. https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API
You should be able to submit the data in the form to some endpoint that returns the HTML you wish to inject.
Once the HTML has been successfully returned, simple document.createElement methods with append (https://developer.mozilla.org/en-US/docs/Web/API/ParentNode/append) will need to be used.
Good luck learning the web!

trumbowyg plugin won't post

I'm using the WYSIWYG editor trumbowyg to supplement the fact that our CMS sucks. The plan is to help out our authors with the HTML without removing the current system they have in place, which is just a plain form with an textarea for article content.
Unfortunately, after activating trumbowyg on the textarea, nothing posts with it, no matter what I do.
When I say "nothing posts", I mean that the form worked before I added the JavaScript to it, and stopped working after, and I am referring to PHP's $_POST array.
Here's what I've tried (although before I was just doing the basics listed on their website):
<form enctype="multipart/form-data" name="form" method="post">
<!--other inputs ignored, but present-->
<textarea name="article"></textarea> <!--this is the textarea in question-->
</form>
(function(textarea) {
textarea.trumbowyg({ closable: true }).on('tbwblur', function() {
console.log('working'); //This works
textarea.text(textarea.trumbowyg('html'));
});
})($("textarea[name=article]"));
I did start with the following, which didn't work:
$("textarea[name=article]").trumbowyg({ closable: true });

I was having a similar issue and couldn't find a solution anywhere. After submitting my question to Alex (the author of Trumbowyg), I realized the answer was staring me in the face in the Trumbowyg docs. See https://github.com/Alex-D/Trumbowyg/issues/341 .
Trumbowyg Docs

Variable Transfer: Web Form that connects with PHP to Database

Hello and thank you for viewing my question. I am a complete beginner and am looking for simple ways to do the following...
What I have in seperate linked documents:
HTML, CSS, Javascript, PHP
What I am having trouble with:
I need to use something like JSON (although I would also accept XML requests or Ajax at this point if they work) to transfer variables from Javascript to PHP. I need the variables to search in a database, so they need to be literally available within PHP (not only seen on a pop-up message or something).
I have seen a LOT of different ways to do this, I have even watched tutorials on YouTube, but nothing has worked for me yet. The things I am having the biggest problem with is that when I add a submit button to my form it doesn't submit my form and I don't know why.
Form code snippet:
<form id="form" name="input" method="post" action="javascript:proofLength();">
<input id="userinput" type="text" autofocus />
<input id="submit" type="button" value="submit" onsubmit="post();">
</form>
The second to last line there doesn't work. Do I need javascript to submit the form? Because I really thought that in this case it was part of the functionality of the form just like method="post"...
The other thing is that for JSON, I have no idea what to do because my variables are determined by user input. Therefore, I cannot define them myself. They are only defined by document.getElement... and that doesn't fit the syntax of JSON.
Those are really my main problems at the moment. So if anyone could show me a simple way to get this variable transfer done, that would be amazing.
After this I will need to search/compare in my database with some php/sql (it's already connecting fine), and I need to be able to return information back to a in HTML based on what I find to be true. I saw one example, but I am not sure that was very applicable to what I am doing, so if you are able to explain how to do that, that would be great also.
Thank you very, very much.
April

You don't need ajax to submit this form. You don't even need javscript. Just do this:
<form id="form" name="input" method="post" action="mytarget.php">
<input id="userinput" name="userinput" type="text" autofocus />
<input id="submit" type="submit" value="submit" />
</form>
This will send the form data to mytarget.php (can be changed of course)
See that i have added the name attribute to your text-field in the form and i changed the type of the button to submit.
Now you can work the Data in mytarget.php like this:
<?
$username = $_POST['userinput'];
echo "Your name is: ".$username;
?>
You wanted to have a check for length in the submit. There are two ways to this:
Before the input is send (the server is not bothered)
Let the server Check the input
for 1 you will have to append a event listener, like this:
var form = document.getElementById("form");
form.addEventListener("submit", function(event){
console.log("test");
var name = form.elements['userinput'].value;
if(name.length < 3){
alert("boy your name is short!");
event.preventDefault();
}
});
Enter a name with less then 3 characters and the form will not be submitted. test here: http://jsfiddle.net/NicoO/c47cr/
Test it Serverside
In your mytarget.php:
<?
$username = $_POST['userinput'];
if(strlen($username) > 3)
echo "Your name is: ".$username;
else
echo "your name was too short!";
?>
You may also do all this with ajax. You will find a lot of good content here. But I'd recommend a framework like jQuery to do so.

The problem is in this line
<form id="form" name="input" method="post" action="javascript:proofLength();">
The action should be a PHP page (or any other type of server script) that will process the form.
Or the proofLength function must call submit() on the form
In the php page you can obtain variable values using $_GET["name"] or $_POST["name"]
To summarize; your code should look like this
<form id="form" name="input" method="post" action="yourpage.php">
<input id="userinput" type="text" autofocus />
<input id="submit" type="button" value="submit">
</form>
and for your php page:
<?php
$userinput = $_POST["userinput"];
//Do what ever you need here
?>
If you want to do something in your javascript before submitting the form, refer to this answer

How can I send wysiwyg editor code to php by ajax

I have nicEditor wysiwyg editor in my page (textarea tag) .
I want to send the output of the code editor to php page by ajax , this is my request .

You can do a php require to include any type of file:
textarea.html:
<textarea>
//htmlcode
</textare>
page.php:
<?php
//php code
require "textarea.html"
?>
is that what you are talking about?
Or are you refering to using javascript to get html code from the file?

i don't know exactly how nicEdit works, but according to nicedit.com, it just changes all <textarea>s to rich html editors. I'm guessing you can still refer to the textareas the same way, which would by to do what #atlavis said:
<textarea id='text1'></textarea>
<script>
var textarea document.getElementById('text1').value;
textarea = escape(textarea);
//now send textarea to the php with a XHR request
</script