When check box is selected, it copies value from customer to invoice party. So I am assuming that when check box selected. value is automatic. but it is saying undefined array key.
function EnableDisableTextBox(tickSame) {
var shipper = document.getElementById("iP");
var customer = document.getElementById("consignee").value;
document.getElementById("iP").value=customer;
shipper.disabled = tickSame.checked ? true : false;
if (shipper.enabled) {
shipper.blur();
}
}
I hope you are submitting the form to the server side. Disabled inputs will not submit data when submitting the form. Instead you can use readonly attribute to make to non editable (Even you can make it look like disabled with css)
function EnableDisableTextBox(tickSame) {
var shipper = document.getElementById("iP");
var customer = document.getElementById("consignee").value;
document.getElementById("iP").value=customer;
shipper.readonly= tickSame.checked ? true : false;
if (shipper.readonly) {
shipper.blur();
}
}
Related
I have two fields, field1 is a checkbox and field2 is a normal text field. I want to hide a field2 if a field1 is not checked and if
field1 is checked then show field2. For that, I am creating the following code:
odoo.define('survey_inherit.FormView', function (require) {
"use strict";
var FormView = require('web.FormView');
var core = require('web.core');
var QWeb = core.qweb;
var FormView = FormView.extend({
_checkField: function(){
var $checkbox = $('.custom-control-input').val();
if ($checkbox.is(':checked')) {
$('.o_form_label').show();
$('.mandatory_msg_class').show();
}else{
$('.mandatory_msg_class').hide();
}//close else
},
});//close FormController
return FormView;
});
But field2 is not hidden if field1 is not checked and also field2 is not shown if field1 is checked.
Update
My requirement is that I have one form which contains a one2many field with widget many2many_tags and other fields. After clicking on tags of many2many_tags, I want to display the complete records in other fields. I am able to get complete records after a click on tags and also these records are able to put in other fields. After using attrs and opening form view for creating records field2 will never display. But open form view in edit mode after creating a record and click on many2many_tags
field2 is not displayed because of attrs.
Removing attrs and opening form view for creating records field will display(but don't want to display because field1 is not checked) and open form view in edit mode after creating a record, click on many2many_tags work fine as expected.
Attrs condition: attrs="{'invisible':[('constr_mandatory','!=',True)]}"
constr_ mandatory: checkbox field
This is the reason I am not using attrs and trying to achieve with the help of javascript. I hope the provided information is understood. Also, I have updated the question added screenshots for better understanding.
Using attrs:
Using attrs click on many2many_tags
Without using attrs:
You can add a new widget and override the click method.
I did this with a BooleanToggle field.
var basic_fields = require('web.basic_fields');
var Toggle = basic_fields.BooleanToggle.extend({
_onClick: function (event) {
var self = this;
this._super(event);
var node = event.view.$('.custom-control-input');
if(this.value) {
node.show();
} else {
node.hide();
}
},
});
fieldRegistry.add('toggle', Toggle);
You need to add the widget attribute:
field name="field1" widget="toggle"/>
Edit
You need to hide the fields after the form loaded, I suggest to you to override the autofocus function of the FormRenderer.
var FormRenderer = require('web.FormRenderer');
FormRenderer.include({
autofocus: function () {
var self = this;
// In my test I used fields values available in "self.state.data"
if(self.state.model === 'sale.order' && field_value){
var nodes = window.$('.custom-control-input');
nodes.hide();
}
return this._super();
},
});
var $checkbox = $('.custom-control-input').val();
This line set $checkbox to the checkbox's value. May be you just want the checkbox element itself:
var $checkbox = $('.custom-control-input');
Try jQuery
$(function() {
$("#selpoNO").click(function() {
if ($(this).is(":checked")) {
$(".if_pucEntry").show();
} else {
$(".if_pucEntry").hide();
}
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- checkbox -->
<label class="led-label"><input type="checkbox" class="led-btn" name="selpoNO" id="selpoNO" style="width: auto !important;"><strong>Checkbox</strong></label>
<!-- text box -->
<input type="text" class="form-control if_pucEntry" id="" name="" style="display: none;">
I have a dropdown with two text values "Regular" and "Irregular" in my jsp. I need to send the selected dropdown text to servlet using hidden form field. I am doing the following :
function addFundTypeHiddenFormField() {
var dropdown= document.getElementById("dropdown");
var formReq = document.getElementById("formReq");
var input = document.createElement('input');
input.id = 'fundingType';
input.type = 'hidden';
input.name = "fundingType";
input.value = fundType.options[fundType.selectedIndex].text;
console.log("dropdown: "+dropdown.options[dropdown.selectedIndex].text);
formReq.appendChild(input);
}
"Regular" is the default choice in dropdown. If I change it to "Irregular" and submit the form, the servlet receives the value "Irregular". But, if I change the dropdown to "Irregular" and then again revert to "Regualr" and submit the form, the servlet still gets "Irregular" for 'fundingType'. The console.log prints correct value as whatever choice I make for the dropdown. I am at a loss here.. what changes do I do so that correct hidden input value is sent to the servlet?
Adding the following piece of code helped
if(document.getElementById("fundingType")==null){
console.log("input doesn't exist");
}
else{
console.log("input exists");
formReq.removeChild(document.getElementById("fundingType"));
}
I am trying to change the value of a hidden field on submission by JavaScript. In my page there are two buttons, one for going back to homepage (index.php) and another for returning to the first page for data entry (addData.php). I am trying to use a hidden field with id "goHome" to control the routeing. My codes are like this:
HTML (Form only)
<form name = "addDataReal" id = "addDataReal" method = "POST" action = "addDataProc.php" onsubmit="return checkNSub()">
<!-- Other items -->
<input type = "submit" name = "submitBtnF" id = "submitBtnF" class="shortText" style = "width: 120px;" value = "Submit + Home" onclick = "return getGoValue(true)"/>
<input type = "submit" name = "submitBtnR" id = "submitBtnT" class="shortText" style = "width: 120px;" value = "Submit + Next" onclick = "return getGoValue(false)"/>
<input type = "hidden" name = "goHome" id = "goHome" value = "" />
</div>
</form>
Javascript
function checkNSub() {
//form validation functions
//OK then return true
//Not then return false
}
function getGoValue(goHome) {
if (goHome) {
document.getElementById("goHome").value = "true";
} else {
document.getElementById("goHome").value = "false";
}
return true;
}
Before this I have tried many other versions and I refered to these few questions:
Set form hidden value on submit
Setting a form variable value before submitting
How to change the value of hidden input field before submitting
But none of the methods were working for me.
For practical purposes there is a workaround for this, but I want to know if I would like to keep these two buttons, how should my code be modified so that the value of "goHome" can be changed before the form is submitted? After many attempts I am still getting $_POST["goHome"] = "".
Also, why is the form submitted before the value is actually changed when the code is placed before that?
Thanks!
It's old question But I thought If any one still looking for the answer , here it is
You can try jquery $('input[name="goHome"]').val('true');
or JS - document.getElementByName("goHome").value = "true";
This will work for sure.
While updating any value at the time of submitting for use name selector instead of ID, that will save you some time :)
When we try to change value of Hidden field at the time of submitting form it didn't update value because DOM has already detached the ID from the input parameter but name is still there because name is going to be passed in form.
If anyone find this useful and they do not have to work for lot hours for a simple solution :)
Happy Coding :)
Various ways to achieve this. Firstly though keep in mind that you are using type="submit" <input> inside a <form> , and that means that they will automatically submit the form regardless of an onclick event or not.
One as much as less intrusive (to your code) way is the following:
Take out the submit inputs from your form like this:
Example :
<form name = "addDataReal" id = "addDataReal" method = "POST" action = "whatever.php">
<!-- Other items -->
<input type = "hidden" name = "goHome" id = "goHome" value = "" />
</div>
</form>
<input type = "submit" name = "submitBtnF" id = "submitBtnF" class="shortText" style = "width: 120px;" value = "Submit + Home" onclick = "return getGoValue(true)"/>
<input type = "submit" name = "submitBtnR" id = "submitBtnT" class="shortText" style = "width: 120px;" value = "Submit + Next" onclick = "return getGoValue(false)"/>
Change your getGoValue() and checkNSub() functions like this :
function checkNSub() {
//form validation functions
//OK then return true
//Not then return false
var myForm = document.getElementById('addDataReal');
myForm.submit();
}
function getGoValue(goHome) {
if (goHome) {
document.getElementById("goHome").value = "true";
console.log(document.getElementById("goHome").value);
checkNSub();
} else {
document.getElementById("goHome").value = "false";
console.log(document.getElementById("goHome").value);
checkNSub();
}
return true;
}
Try it out.
P.S : A couple of console.logs so you can check out the value changing. Comment out checkNSub(); to see them in your console. Nevertheless keep in mind that you are posting a Form which means you are going to load a new page from the server , this new page will be agnostic regarding your "goHome" value. The "goHome" value exists only while you are on the same page. The moment your DOM is "recreated" you will lose it.
P.S.2 :
Your return true; inside the getGoValue(); is not needed in my
example. You can remove it.
the return in your onclick = "return getGoValue(true)" is also
not needed and you can remove it
P.S.3 :
This reply is focused on keeping most of your code intact. In reality now that you have your inputs outside the form there is no need for them to be of type="submit" you should change them to <button> with onClick events (or Listeners).
My client needs to make an operation on products custom options.
Using Magento CE, I create a product, and give it some custom options from within the built-in left hand side menu in "Manage products" > "Add new product", such as "mm" (millimeters) and "mt" (meters)
This product will have both radio options and a textbot input.
Let's say we have
Base price: 0
MM:
Radio option A which costs 0,9
Radio option B which costs 1,2
Radio option C which costs 2,3
MT:
Textbox value = unknown yet
Let's say user chooses Radio option B and enters 10 in the textfield
Price should be updates as such:
1,2 * 10 + 0
Which is
radio value cost * textbox value + base price
Is there any way to tell the code to take the value of the radio button, multiply it for the value of the textbox and sum it all to the base price?
Where could I look to see the current behavior of a product's custom options?
EDIT
I saw that whenever a value is selected, the reloadPrice() function is called.
I thought to check if both inputs are radio and text, then get the value of the text and multiply it for the value of the radio.
Is that right? Can you point me better?
This helps me, I hope this will also helps you
initialize : function(config){
this.config = config;
this.reloadPrice();
document.observe("dom:loaded", this.reloadPrice.bind(this));
},
reloadPrice : function(){
price = new Number();
config = this.config;
skipIds = [];
skipIds = [];
relatedword = [];
relatedvalue = [];
relatedid = [];
counter_each=0;
counter=1;
first=0;
areaValue=1;
submitbutton=true;
$$('body .product-custom-option').each(function(element){
var optionId = 0;
element.name.sub(/[0-9]+/, function(match){
optionId = match[0];
});
if (this.config[optionId]) {
if (element.type == 'checkbox' || element.type == 'radio')
{
if (element.checked)
{
if (config[optionId][element.getValue()])
{
<?php if(Mage::getVersion() >= 1.7): ?>
price += parseFloat(config[optionId][element.getValue()].price);
<?php else: ?>
price += parseFloat(this.config[optionId][selectOption.value]);
<?php endif; ?>
}
}
}
}
reloadPrice() does not update product price at server level. One way to do this product price update is by implementing checkout_cart_product_add_after event.
Do you custom logic at client level with javascript in detail page. Assign this value to some hidden variable under the form product_addtocart_form. A better way is to save to session to reduce client side vulnerabilities or you can find your own better way. Or Implement your login only in Observer method. Whatever you find secure.
Rewrite the class Mage_Checkout_Model_Cart to modify as,
public function addProduct($productInfo, $requestInfo=null)
{
...
Mage::dispatchEvent('checkout_cart_product_add_after', array('quote_item' => $result, 'product' => $product,'request_data'=>$request));
...
}
In your yourmodule/etc/config.xml:
<config>
...
<frontend>
...
<events>
<checkout_cart_product_add_after>
<observers>
<unique_name>
<class>modulename/observer</class>
<method>customPrice</method>
</unique_name>
</observers>
</checkout_cart_product_add_after>
</events>
...
</frontend>
...
</config>
And then create an Observer class at yourmodule/Model/Observer.php
class <namespace>_<modulename>_Model_Observer
{
public function customPrice(Varien_Event_Observer $observer)
{
// Get the quote item
$item = $observer->getQuoteItem();
$request=$observer->getRequestData();
// Ensure we have the parent item, if it has one
$item = ( $item->getParentItem() ? $item->getParentItem() : $item );
// Load the custom price
$price = "custom price logic";//whatever from your hidden value or by some other mean.
// Set the custom price
$item->setCustomPrice($price);
$item->setOriginalCustomPrice($price);
// Enable super mode on the product.
$item->getProduct()->setIsSuperMode(true);
}
}
For more information check here
I am trying to make a select field mandatory on a web page. I know how to do it with help of JS and form attribute 'onsubmit' and returning the function. But the problem is that form code is already written and I dont know how to add attribute now. Let me know if I can append attribute dynamically from JS.
The other way I tried is to call the JS after page loaded. But this isnt making the field mandatory and form can be submitted.
Following is my code..
<!DOCTYPE html>
<html>
<head>
<script>
function f1()
{
var countryValue = document.getElementById('count ID').value;
if (countryValue == "")
{
alert("field value missing");
return false;
}
var stateValue = document.getElementById('state ID').value;
if (stateValue == "")
{
alert("state field value missing");
return false;
}
}
</script>
</head>
<body>
<form method = "post" action = "33.html">
Country: <input type="text" id="count ID">
state: <select id="state ID">
<option></option>
<option value="ap">ap</option>
<option value="bp">bp</option>
</select>
<br>
<input type = "submit">
</form>
<script>window.onload=f1</script>
</body>
</html>
Please help.
Have a look at this since you have messed up the IDs
Live Demo
window.onload=function() {
document.forms[0].onsubmit=function() { // first form on page
var countryValue = this.elements[0].value; // first field in form
if (countryValue == "") {
alert("Please enter a country");
return false;
}
var stateIdx = this.elements[1].selectedIndex; // second field
if (stateIdx < 1) { // your first option does not have a value
alert("Please select a state");
return false;
}
return true; // allow submission
}
}
PS: It is likely that POSTing to an html page will give you an error
To get the last button to do the submission
window.onload=function() {
var form = document.forms[0]; // first form
// last element in form:
form.elements[form.elements.length-1].onclick=function() {
...
...
...
this.form.submit(); // instead of return true
}
}
Once you've got a function to detect improper values (empty mandatory field or anything else, like a bad e-mail address for instance) you have a few different options :
disable the submit button
cancel the onclick event on the button
cancel the submit event on the form
disabling the submit button can be annoying for the user (it might flash on and off while the values are entered).
I had the same issue, but i made a extension. Using hook system to translate fields with "*", in the names, to validate like required field. This is a simple solution not intrusive where is not required addition of fields in the database, only by the use of sufix "*" in configuration of custom fields.
There is the code: https://github.com/voiski/bugzilla-required-field