How to stay on the same page after a form submission integrated to a Google form - vue.js

In my website i have a contact form, and i've integrated it with a Google form. I've added the google form's execute URL as the action URL so once its submitted the form is being populated with the form data. the way i have done it
But when its being submitted, its redirecting to a google form's response page. What i need is once its submitted, to stay on the same page and give an alert. Im not sure how to do this in vue js. Any suggestion will be appreciated.
the content on the redirected page
{"result":"success","data":"{\"name\":[\"sdvsdv\"],\"company\":[\"dsvdv\"]}"}
Form in vue js view
<form method="POST" id="appointment-form" action="https://script.google.com/macros/s/AKfycbzRHvjfmIZdwKnOm26PeFv64OyyyGAfcr68MxvYw/exec">
<div class="form-group">
<input type="text" placeholder="Your name" name="name" class="form-control" id="name" required>
</div>
<div class="form-group">
<input type="text" placeholder="Company name" name="company" class="form-control" id="company" required>
</div>
<buttontype="submit" class="btn btn-default btn-block form-submit-btn">Submit</button>
</form>

After read your code properly, i found many errors.
How are you saving input values?
To save, you have to use ```v-model directive````
I guess you save the input values in somewhere. To avoid your problem, you can add a method and call it on submit, and inside the method save your input values.

Related

Validations not working in ODOO website

I have created a template and a controller for it in ODOO v8. Following is the template:
<template id="myTemplate">
<t t-call="myTemplateHeader"/>
<div class="myClass">
<form action="/myControllerAction" name="myTemplateForm">
<input type="text" id="name" name="name"/>
<input type="text" id="lname" name="lname"/>
<input type="text" id="email" name="email"/>
<input type="submit" value="Submit"/>
</form>
</div>
</template>
And I have written a controller for the action /myControllerAction.
#http.route(['/myControllerAction'], type='http', auth="public", website=True)
def index(self, **post):
data = {}
# some action here
# to submit and fetch values
request.website.render("my_module.mySecondTemplate", data)
I have added validations on the fields in the form so that one cannot submit the form without entering the values in all the text fields given. The validations in JS works, it shows an alert message when the text fields are blank(one alert for each text field). But, after clicking the OK for the alert message of email field, it submits the form even when the field is empty. I have checked the issue and found that the problem exists only if I provide
<input type="submit" value="Submit"/>
and it will be solved if I am using
<input type="button" value="Submit"/>
But I have to make some calculations in the controller and need to retrieve some data from the database to show on the next page. For this, type="button" cannot be used as it just submit the form and redirect to next page without making a call to the controller function. type="submit" will make the call to the controller, but validations are not working as described earlier. Also submitting the form using onclick event of the button in javascript won't call the controller. I want validations on the form and then call the controller(on submit). Is there any way I could implement this in ODOO v8?
For making fields mandatory in ODOO templates, the attribute required="required" can be used on input fields.
<input type="text" id="name" name="name" required="required"/>

i want to change url parameters

hi my url is something like this abc.domain.com/add/firstname/phone/email which is api link. i want to change parameters first name,phone,email when user enters in form. please let me know if anyone can help. thanks in advance.
add/?Client+Name=&Phone+number=&Email+ID=&Partner+ID=AUOVML i dont want url in this format. format must be as i mentioned in first line. i have done something like this:
<form method="get" action="http://abc.domain.com/add/">
<div class="d-nt-signup">
<div class="d-nt-field-wrap">
<input type="text" label="Name*" id="first_name" name="Client Name" active-color='#FB165B' class="d-nt-login-filed">
</div>
<div class="d-nt-field-wrap">
<input type="text" label="Mobile*" id="mobile" name="Phone number" active-color='#FB165B' class="d-nt-login-filed">
</div>
<div class="d-nt-field-wrap">
<input type="email" label="Email*" id="email ID" name="Email ID" active-color='#FB165B' class="d-nt-login-filed">
</div>
<div class="d-nt-field-wrap">
<input type="hidden" name="Partner ID" value="AUOVML">
</div>
When you do a get request with a form you will get the names and values of the form inputs added to the URL like that.
You can get around that by using a post request instead. Change method="get" to be method="post".
Developers will often handle the result of the form being sent with PHP. Change the action to point to a PHP file, and then in the PHP file you can access the form data through the $_post array like so $_POST["form_input_name"].
See http://php.net/manual/en/tutorial.forms.php for an example of echoing back data typed into a form.

Prestashop smarty make a form for user and save the input fields to the database?

In Prestashop I am doing a module. In that module I have view file(smarty template). In smarty I am doing form so that user can submit the form from frontend. Now when user makes fill the form and clicks on submit then the form should save all the vales to thae database. So for that in smarty I made a form like this
<div id="content" class="form-wrapper" >
<div class="form-content">
<input type="text" id="name" name="name" placeholder="Name" /> <br />
<input type="text" id="email" name="email" placeholder="email"/> <br />
<input type="text" id="phone" name="phone" placeholder="Phone Number"/> <br />
<input type="submit" name="submit-query" id="submit-enquiry" value="submit" />
</div>
</div>
and in the file where the values will be submitted I have made my code like this
<?php
include '../../../config/settings.inc.php';
include '../../../config/defines.inc.php';
include '../../../config/config.inc.php';
include(dirname(__FILE__).'/../../../../init.php');
if(Tools::getValue('submit-query')) {
$this->_html .=$this->displayConfirmation($this->l('Settings updated successfully'));
}
else {
$this->_html .= $this->displayError($this->l('You Have Some Errors'));
}
?>
Now when doing click on my submit button It is showing error like this
Fatal error: Using $this when not in object context in file.php on line 11
Now can someone kindly tell me what is the issue here and how can I make a form in smarty for frontend users so that they can submit the form and the value will be stored to the database. Any help and suggestions will be really appreciable. Thanks
First I would recommend to do the processing inside of your module, e.g. in init() function, you can get your module link using $this->context->link->getModuleLink('myModuleName'); and add it to the form action attribute, all variables can be assigned using $this->context->smarty->assign().
Storing values in database is quite a wide question. You have to provide some more details about it.
Check some tutorials from Prestashop e.g. Creating a Prestashop Module. You will find most of your answers there.

text fade on input field, where is this being configured

i have this website im building, my client is using a template and the template has contact forms, now i cant seem to understand how to get the text fade on click for input fields to work on any additional fields i make on top of what was there on the template.
http://daniloportal.com/NPC2/contact.html
on that page take a look at the form, the values with *'s disappear but the clone EMAIL input i made doesnt cause i took the * off the value.
Ive been going crazy trying to figure out where this is being configured on the page, If any inspect elementors can take a look and let me know i would greatly appreciate it!
this is the code snip
<form id="ajax-contact-form" action="">
<input type="text" name="name" value="Name *" title="Name *" />
<input type="text" name="email" value="Email *" title="Email *" />
<input type="text" name="email" value="Email " title="Email *" />
<textarea name="message" id="message" title="Message *">Message *</textarea>
<div class="clear"></div>
<input type="reset" class="btn btn_clear" value="Clear form" />
<input type="submit" class="btn btn_blue btn_send" value="Send message!" />
<div class="clear"></div>
</form>
Search your code to find what makes the input's value disappear. E.g., look for behavior that clears the value of form fields (either element.value = '' if using plain javascript, or element.val('') if using jquery).
Then you can see what is the condition to clearing it. In your case, seems that the condition is that the input's value is equal to it's "title" attribute (you can edit both using "Inspect Element" in Chrome).

How to get Index of the FORM Element in the WebBrowser Control?

let say a site has 2 forms: one search form and the other is a registration form...
<form>
Search: <input type="text" name="s">
<input type="hidden" name="a" value="search">
<input type="submit" value="Search">
</form>
[..]website content blabla[...]
<h2>Registration</h2>
<form>
E-Mail: <input type="text" name="email">
<input type="hidden" name="a" value="reg">
<input type="submit" value="Register">
</form>
If I submit a form, I want to know to which form the clicked submit button belongs. GetElementbyId is not possible because the id is not always available. I want to get the index. Any ideas? (WebBrowser Element in VB.NET or C#)
You cant refer to Form object of Input Element e.g btn.Form.Name should work; give it a try
http://msdn.microsoft.com/en-us/library/aa703812(v=vs.85).aspx (reference to IHTMLInputElement::form Property)