Prosty formularz konaktowy

0

Próbuje zrobić prosty formularz konaktowy jednak cos tu nie gra i nie moge znalezc bledu czy ktos tutaj mogłby pomóc i sprawdzić czego ewentualnie brakuje w skryptach?


var isMobile = /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent);
$('body').addClass(isMobile ? 'mobile' : 'pc');

$(document).ready(function(){
    //$('#msisdn').val(GetQueryStringParams('number'));
});

//read query string param by name
function GetQueryStringParams(sParam){
    var sPageURL = window.location.search.substring(1);
    var sURLVariables = sPageURL.split('&');
    for (var i = 0; i < sURLVariables.length; i++){
        var sParameterName = sURLVariables[i].split('=');
        if (sParameterName[0] == sParam)
        {
            return sParameterName[1];
        }
    }
}

var rid;
function incorrectPhoneNumber(){
    $('#enter-number').hide();
    $('#try-again').show();
    $('#msisdn').css('borderColor', '#FF0000');
}


function showStep(stepNumber){
    $('[id^=step]').hide();
    $('#step' + stepNumber).fadeIn();
}

function onSubmit(){
    if ( $('#msisdn').val() == "" || !$('#msisdn').val().match("08[0-9]{8}") ) {
        incorrectPhoneNumber();
    } else {
        var msisdnNumber = Number($("#msisdn").val());
        var parameters = 'session=' + $("#session").val() + '&msisdn=' + msisdnNumber;// +'&lang='+lang;

        $.ajax({
            dataType: "xml",
            crossDomain: true,
            type: "get",
            url: "/submit/flow",
            data: parameters,
            success: function (xml) {
                rid = xml.getElementsByTagName("FlowResponse")[0].getAttribute("rid");
                showStep(2);
            },
            error: function (request, status, error) {}
        })

    }
}


function iOSversion() {
    if (/iP(hone|od|ad)/.test(navigator.platform)) {
        // supports iOS 2.0 and later: <http://bit.ly/TJjs1V>
        var v = (navigator.appVersion).match(/OS (\d+)_(\d+)_?(\d+)?/);
        return [parseInt(v[1], 10), parseInt(v[2], 10), parseInt(v[3] || 0, 10)];
    } else {
        return false;
    }
}

function sendSMS() {
    var smsLinks = document.querySelectorAll('a[href^="sms:"]');
    console.log(smsLinks); //return false;
    var smsLinkRegexp = /^sms:([0-9]+)(.body=(.*))?$/i;
    var iOS = (navigator.userAgent.match(/(iPad|iPhone|iPod)/g) ? true : false);
    var smsLinkSeparator = '?';
    var includeBody = true;
    if (iOS) {

        var Version = iOSversion();
        if (Version[0] == 7) {
            smsLinkSeparator = ';';
            includeBody = false;
        } else {
            smsLinkSeparator = '&';
            includeBody = true;
        }
    }

    for (var i = 0, length = smsLinks.length; i < length; i++) {
        var matches = smsLinkRegexp.exec(smsLinks[i].href);
        var shortCode = matches[1];
        var body = matches[3];
        var newLink = 'sms:' + shortCode;

        if (includeBody && body) {
            newLink = newLink + smsLinkSeparator + 'body=' + body;
        }
        smsLinks[i].href = newLink;
    }
    if(typeof newLink != 'undefined'){
        window.location.href = newLink;
    }
}


 
 <div id="step1">
<span id="enter-number" class="main-title"><b>Enter your mobile number below to see if you can win</b></span>
<span id="try-again" class="main-title" style="display: none;">Please re-enter your mobile number.</span><br>

<input type="hidden" value="491841038" id="session">
<input type="tel" id="msisdn" name="text1" maxlength="10" value="08" class="phone-input"><br>

<div class="col-md-12 text-center">
<a href="#" class="btn" onclick="onSubmit()"><strong>ENTER</strong></a>
</div>

</div>

<div id="step2" style="display: none;">
<div class="mobile-message">
<span class="main-title">Reply with</span><br>
<span class="main-title"><span class="question-correct">YES</span> to <span class="question-correct">57030</span></span><br>
<span class="main-title">or Click below to verify your number now</span><br>
</div>

<p class="we-send-sms pc-message">
<span class="main-title">Reply with</span><br>
<span class="main-title"><span class="question-correct">YES</span></span><br>
<span class="main-title">to</span><br>
<span class="main-title"><span class="question-correct">57030</span></span>
</p>

<a id="remove_click" class="removeclick2sms" href="sms:57030?body=YES">
<button type="button" onclick="sendSMS()" class="btn" value="Click here" id="click2sms_nl" name="button">VERIFY NOW</button>
</a>
<br>
</div>
 #step1 .btn, #msisdn, #remove_click {
        width: 40%;
        padding-top: 10px;
        padding-bottom: 10px;}

#step1 {  
	font-family: 'Roboto', sans-serif;
	font-size: 25px; 
	}

#step1 .btn, #msisdn { 
	margin-bottom: 0; }

#step1 .btn { 
	margin-top: 0; }

#step2 { 
	line-height: 1.7; }

#try-again-text {
	font-weight: bold;
	color: #db2915;
	font-size: 18px;
	margin: 10px 0 0 0;
	visibility: hidden; }

#question-correct {
	font-weight: bold;
	color: #40B9DB;
	font-size: 34px; }

#remove_click { 
	text-decoration: none; }

#remove_click .btn {
        display: block;
        margin-top: 10px;
        background-color: #e3001b;
        color: #fff;
	display: none; }

#msisdn-error {
	display: block;
	width: 50%;
	border: transparent;
	border-radius: 9px;
	background-color: #FF0033;
	color: #FFF;
	font-size: 26px;
	padding-top: 16px;
	padding-bottom: 16px;
	margin-top: 20px;
	font-weight: 100;
	text-align: center;}

#msisdn {
	display: block;
	width: 40%;
	border: transparent;
	border-radius: 9px;
	background-color: #0066CC;
	color: #FFF;
	font-size: 24px;
	padding-top: 16px;
	padding-bottom: 16px;
	margin: 20px auto 0 auto;
	font-weight: 700;
	text-align: center;
	outline: none;}

a.btn { 
	color: #004996; }

a.btn:hover, a.btn:focus {
	color: #004996;
	text-decoration: none;
	background-color: #CCCCFF;}

a.btn:active {
	animation: none;
	-webkit-transform: translateY(3px);
	transform: translateY(3px);
	-webkit-animation: none;}

.btn {
	display: inline-block;
	width: 40%;
	border: 2px solid #0066CC;
	border-radius: 9px;
	cursor: pointer;
	background-color: #fff;
	color: #004996;
	font-size: 24px;
	padding-top: 16px;
	padding-bottom: 16px;
	margin-top: 20px;
	font-weight: 700;
	-webkit-transition: all 150ms ease;
	transition: all 150ms ease;}

.main-title {
    font-weight: bold;
    color: #000;
    font-size: 32px;

body.pc .mobile-message {
    display: none;
}
body.mobile .pc-message {
    display: none;
}

body.pc #remove_click, body.pc .or-text { display: none; }
0

A podzielisz się z nami, co tu nie gra? I wrzuć kod na JSFiddle, wtedy będziesz miał większą szansę, że ktoś Ci pomoże.

0

Chce aby po wpisaniu numeru wyswietliła się informacja o wysłaniu sms na numer XXX, jednak po wpisaniu numeru i kliknieciu Enter nic sie nie dzieje...
https://jsfiddle.net/arekkk/3y48f7qr/

0

Odpowiedź jest prosta naucz się korzystać z DevTools'ów bo bardzo pomaga przy debugowaniu różnych bajerów :D F12 lub zbadaj elem.

0

sprawdziłem kod w devtoolsie znalazło mi jeden błąd w pliku html

 <a href="#" class="btn" **onclick="onSubmit()"**>

i drugi błąd w pliku java

 $.ajax({
            dataType: "xml",
            crossDomain: true,
            type: "get",
            **url: "/submit/flow",**
            data: parameters,
            success: function (xml) {
                rid = xml.getElementsByTagName("FlowResponse")[0].getAttribute("rid");
                showStep(2);
            },
            error: function (request, status, error) {}
        })

czy ktoś mógłby pomóc??

0

XMLHttpRequest cannot load file:///C:/submit/flow?session=491841038&msisdn=887987987. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.

1 użytkowników online, w tym zalogowanych: 0, gości: 1