Я использую две формы с одной кнопкой отправки, но не работает - PullRequest
0 голосов
/ 23 сентября 2019

Я использую две формы с одной кнопкой «Отправить», но не работает.

1-я форма __ Name , Email , Address __ предназначена для платформы Blogger, которая работает нормально только при публикации без кодирования радиокнопок, помещающего внутрь кода.

2ns Форма - это несколько параметров радио, которая прекрасно работает только в том случае, если она отделена от другой формы.

Еще раз хочу напомнить вам:

Эти формы предназначены для веб-платформы Blogger, которая закодированаХорошо, с прекрасной работой только в Разделенной форме, но когда я объединил две формы с одной кнопкой «Отправить сейчас», она перестала работать

Пожалуйста, решите эту кодировку, не затрагивая и не удаляя атрибут id="".Если я удалю этот код id="ContactForm1_contact-form-submit", то 1-я форма перестанет работать в теме Blogger.

Можно ли заставить одну кнопку работать для двух форм?

document.addEventListener('click', function(event)
{
    let submitBtn = document.getElementById("submitBtn");
    if (event.target.type === "radio" && event.target.name === "number")
    {
        submitBtn.removeAttribute("disabled");
    }
});
function getCheckedValue(radioObj) {
if(!radioObj)
    return "";
var radioLength = radioObj.length;
if(radioLength == undefined)
    if(radioObj.checked)
        return radioObj.value;
    else
        return "";
for(var i = 0; i < radioLength; i++) {
    if(radioObj[i].checked) {
        return radioObj[i].value;
    }
}
return "";
}

// set the radio button with the given value as being checked
// do nothing if there are no radio buttons
// if the given value does not exist, all the radio buttons
// are reset to unchecked
function setCheckedValue(radioObj, newValue) {
if(!radioObj)
    return;
var radioLength = radioObj.length;
if(radioLength == undefined) {
    radioObj.checked = (radioObj.value == newValue.toString());
    return;
}
for(var i = 0; i < radioLength; i++) {
    radioObj[i].checked = false;
    if(radioObj[i].value == newValue.toString()) {
        radioObj[i].checked = true;
    }
}
}
.widget.ContactForm {
    z-index: 1
}

.contact-form-widget {
    margin-left: auto;
    margin-right: auto;
    width:100%;
    max-width:98%;
    padding: 25px 0;
    border:1px solid #b2b2b2;
    -webkit-border-radius: 2%;
    -moz-border-radius: 2%;
    border-radius:3px;
}

.contact-form-widget .form {
    width: 91%;
    margin: 0 auto
}

.ribbon {
    font: 20px Arial;
    text-transform: capitalize;
    position:center;
    background: #6B5F53;
    color: #fff;
    text-align: center;
    padding:7px 0 7px 0;
    margin:0 0 3px 0;
    border-radius:5px;
}

.contactf-name,
.contactf-email,
.contactf-message {
    text-align: left;
    margin-top: 25px;
    color: #000;
    font-size: 13px;
    font-weight:600
   
}

.contactf-name,
.contactf-email {
    float: left;
    width: 100%
}

.contact-form-name,
.contact-form-email,
.contact-form-email-message,
.contact-form-name:hover,
.contact-form-name:focus,
.contact-form-email:hover,
.contact-form-email:focus,
.contact-form-email-message:hover,
.contact-form-email-message:focus {
    width: 100%;
    max-width: 100%;
    margin: 10px 0 0;
    padding: 10px;
    font-size: 12px;
    color: #aaa;
    border-color: #cccccc;
    border-top:1px solid #666666;
    border-left:1px solid #666666;
    border-width: 1px;
    box-shadow: none;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px
}

.contact-form-name,
.contact-form-email {
    height: 35px
}

.contact-form-email-message {
    height: 100px
}
.contact-form-button-submit,
.contact-form-button-submit:hover {
    margin-top: 25px;
padding:0 35px 0 35px;
    height: 37px;
    font: bold 18px Arial;
    outline: none;
    letter-spacing: 1px;
    color: #fff;
    text-align: center;
    cursor: pointer;
    color: #333333;
    background: #d2d2d2;
}
.contact-form-button-submit:active {
    color: #333333;
    border: 1px solid #d6a437;
    background: #febd4b;
    background: -webkit-gradient(linear, 0 0, 0 100%, from(#febd4b) to(#fed970));
    background: -webkit-linear-gradient(#febd4b, #fed970);
    background: -moz-linear-gradient(#febd4b, #fed970);
    background: -ms-linear-gradient(#febd4b, #fed970);
    background: -o-linear-gradient(#febd4b, #fed970);
    background: linear-gradient(#febd4b, #fed970);
    -pie-background: linear-gradient(#febd4b, #fed970)
}

.contact-form-cross {
    border: medium none !important;
    box-shadow: none !important;
    padding: 0 !important;
    height: 11px !important;
    width: 11px !important;
}
input[type=radio] {
    -webkit-appearance: radio;
    -O-appearance: radio;
    -moz-appearance: radio;
    opacity:1;
}

#header .bottom-header.blog h1 {
    font-size: 64px;
	color: red
}

input[type=radio]:hover + label {
border: solid 1px white; padding: 5px; border-radius: 1px;
border-color : red;
color : red;
opacity:1;

}  

input[type=radio]:checked + label {
border: solid 2px white; padding: 5px; border-radius: 1px;
border-color : red;
color : red;
opacity:1;
}

input[type=text] {
font-weight:bold;
}
input[type=text]:hover {
}
input[type=email]:hover {
}
<div class="widget ContactForm" id="ContactForm22">
        <div class="ribbon"><strong>Your Billing Details</strong></div>
    <div class="contact-form-widget">
        <div class="form">
            <form name="contact-form">
                <div class="contactf-name">Your name <span style="color:red">*</span> :<input class="contact-form-name" id="ContactForm1_contact-form-name" name="Full Name" size="30" type="text" value="Full Name" onblur='if (this.value == "") {this.value = "Full Name";}' onfocus='if (this.value == "Full Name") {this.value = "";}' /></div>
                <div class="contactf-email">E-mail address <span style="color:red">*</span> :<input class="contact-form-email" id="ContactForm1_contact-form-email" name="E-mail address" size="30" type="text" value="E-mail address" onblur='if (this.value == "") {this.value = "E-mail address";}' onfocus='if (this.value == "E-mail address") {this.value = "";}' /></div>
                <div style="clear:both"></div>
                <div class="contactf-message">Your Address <span style="color:red">*</span> :<textarea class="contact-form-email-message" cols="25" id="ContactForm1_contact-form-email-message" name="Hometown/ City/ Your State...." rows="5" value="" placeholder="Hometown/ City/ Your State...." value="Hometown/ City/ Your State...." onblur='if (this.value == "") {this.value = "Hometown/ City/ Your State....";}' onfocus='if (this.value == "Hometown/ City/ Your State....") {this.value = "";}'></textarea>
<form name="radioExampleForm" method="get" action="" onsubmit="return false;">
<p>&nbsp;<label for="number0"><input type="radio" value="http://www.paypal.com" name="number"     id="number0"> Pay by Paypal</label></br>
&nbsp;<label for="number1"><input type="radio" value="http://www.instamojo.com" name="number" id="number1"> Pay by InstaMojo</label></br>
&nbsp;<label for="number2"><input type="radio" value="http://www.skrill.com" name="number" id="number2"> Pay by Skrill</label></br>
</p>
</form>
<input type="button" class="contact-form-button contact-form-button-submit" id="ContactForm1_contact-form-submit" id="submitBtn" disabled onclick="window.open(getCheckedValue(document.forms['radioExampleForm'].elements['number']), '_blank');" value="Submit Now">
                </div>
            </form>
        </div>
    </div>
</div>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...