when click on jquery second time not working - html

Prepaid
$(document).on('click','.prepaid_button',function(){
var sevcount=parseInt($('#services_count').val());
servcount=servcount+1;
$('#services_count').val(servcount);
});

The variable name : sevcount changed to servcount which make the error.
I rename all the variable to sevcount
$(document).on('click','.prepaid_button',function(){
var sevcount=parseInt($('#services_count').val());
sevcount=sevcount+1;
$('#services_count').val(sevcount);
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="prepaid_button" > BUTTON </div>
<input id="services_count" value="0" >
Welcome to our community #syam, Glad to welcoming you.

Related

Search term to url

I am trying to make a search engine "comparer." By that I mean I am trying to make a local website that takes a search term and makes it into a clickable search engine URL (google, bing, yahoo, etc). I'm starting with Google. The search term needs to go after https://www.google.com/search?q= I don't know how to add the userSearch onto the end of the URL and make the URL into a clickable link. I'm not even sure that I'm gathering the search term correctly.
<!-- Enter search term -->
<form>
<fieldset>
<legend></legend>
<p>
<label>Search Here! (please, no spaces)</label>
<input type = "text"
id = "userSearch"
var = term
/>
</p>
</fieldset>
</form>
<var> gURL = 'https://www.google.com/search?q=' + userSearch </var>
<script type="text/javascript">
<var> searchTerm = "userSearch"; </var>
<var> gURL = "https://www.google.com/search?q=" + 'searchTerm'; </var>
document.getElementById("gURL").src = url;
</script>
<!-- Search URL results -->
<h3>Results</h3>
<fieldset>
<h4 style="text-align:left;">Google.com
If you can help, thank you. I appreciate it.
I used a button and Jquery - but is this what you are trying to do?
<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
</style>
<script type="text/javascript">
$(document).ready(function() {
$('#userSearch').click(function() {
var fromForm = "<br>" + '<a href="https://www.google.com/search?q="' +
$('#searchField').val() + ">" + 'https://www.google.com/search?q="' +$('#searchField').val() + '</a>';
$('#outPut').append(fromForm);
});
});
</script>
</head>
<body>
<br>
<!-- Enter search term -->
<form>
<fieldset>
<legend></legend>
<label>Search Here! (please, no spaces)</label> <input type='text' id='searchField' placeholder="Search">
</fieldset>
</form>
<button id='userSearch'>Search</button>
<br>
<div id='outPut'>
</div>
I was able to make my comparer using some different code using multiple guides, but I do really appreciate your feedback. I am putting my code up on a Weebly website ( Click here ) and my goal is to make it a tool that makes it easy to search from different engines. It is mostly just for personal use, but I have it set up where others could find it helpful and useful.
I used this code:
<!-- Enter search term -->
<div>
<input name="searchTxt" type="text" maxlength="512" id="searchTxt" class="searchField" float: center; display: block;/>
</div>
<script type="text/javascript">
//creates a listener for when you press a key
window.onkeyup = keyup;
//creates a global Javascript variable
var inputTextValue;
function keyup(e) {
//setting your input text to the global Javascript Variable for every key press
inputTextValue = e.target.value;
//listens for you to press the ENTER key, at which point your web address will change to the one you have input in the search box
if (e.keyCode == 13) {
window.location = "https://www.google.com/search?q=" + inputTextValue;
}
}
</script>
Thank you for all your guy's help, and I will definitely continue learning.

Framework7 formToData not working

I have a screen login in my aplication and to get the form data in framework i need to use formtoData but it wasnt working, so i decided to create another project and copy paste framework docs script but still isnt working.
Index.html(the test project)
<div class="pages navbar-through toolbar-through">
<!-- Page, "data-page" contains page name -->
<div data-page="index" class="page">
<!-- Scrollable page content -->
<div class="page-content">
<form id="my-form" class="list-block">
<ul>
<li>
<div class="item-content">
<div class="item-inner">
<div class="item-title label">Name</div>
<div class="item-input">
<input type="text" name="name" placeholder="Your name">
</div>
</div>
</div>
</li>
</ul>
</form>
<div class="content-block">
Get Form Data
</div>
</div>
</div>
</div>
js (test project)
// Initialize app
var myApp = new Framework7();
// If we need to use custom DOM library, let's save it to $$ variable:
var $$ = Dom7;
$$('.form-to-data').on('click', function(){
alert("dwdq");
var formData = myApp.formToData('#my-form');
alert(formData);
});
Does anyone know why is it not working? thx in advance.
They changed the function, instead of formToData now is formToJSON
You can use booth:
formtoData or formToJson will return the same value: [object Object]
Just use JSON.stringify() to get the desired result.
$$('.form-to-data').on('click', function(){
var formData = myApp.formToData('#my-form');
var formJSON = myApp.formToJSON("#my-form");
console.log(JSON.stringify(formData));
console.log(JSON.stringify(formJSON));
});
{"name":"Alexandre"}
{"name":"Alexandre"}
Or you can even serialize the form like that:
$$('.form-to-data').on('click', function(){
var formData = $$.serializeObject(myApp.formToJSON($$("#my-form")));
console.log(formData);
});
name=Alexandre
Edit: Framework7 got updated to v4, and now it works this way:
Single Line:
var dados = JSON.stringify(myApp.form.convertToData('#my-form'));
They changed the function again, at least in V2. The new function that works for me is:
var formData = myApp.form.convertToData("#form-id");
var formString = JSON.stringify(formData);
Framework 7 convertToData is ignoring input type text array: for example:
<input type="text" name="no_invoice[]" />
Removing [] doesn't work either.
F7 only take as array checkbox/radio fields, this bug must be solved.
I solved using javascript:
new FormData(your_form);

can someone please tell me why i am not getting the quote on codepen?

random quote generator
$(document).ready(function(){
function getQuote(){
var url = "http://api.forismatic.com/api/1.0/?method=getQuote&lang=en&format=jsonp&jsonp=?";
$.getJSON(url,function(data){
$(".quote").html(data.quoteText);
});
};
$("#newQuote").on("click",function(){
getQuote();
});
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class = "container text-center">
<h3>Random Quote Generator</h3>
<p>Some of greatest quotes for thought.</p>
<div class="quoteBox">
<span class = "quote"></span><br>
<span class="auther"></span>
</div>
<button type = "submit" id = "newQuote" class ="btn btn-default">New quote</button>
</div>
it is working while running here but not on codepen. can someone please tell me why?
thanks guys...i got it. since it is the unsafe source so without using https, it work just fine.

Button - Voucher onclick

Hello community need some assistance,
I am trying since couple days to add into exit-popup template one php button which onlick interacts with less template and adds Voucher code into the cart.
I got no success yet, if someone could assist me. Could possibly award somehow :)
Theoreticly its could even be possible to inject into sql onlick instead of injecting to element.
Github Original cart_footer.tpl
Github Original Voucher.tpl
Platform: shopwaredemo.de/
and any item to cart, so you can see elemnts
So far i have done:
Form:
<form method="post" action="{url action='addVoucher' sTargetAction=$sTargetAction}">
<div class="popupbanner">
<a href="#" class="myButton" clickon="copyToClipboard('#p2');ImportVoucher('FREE16')" >
<div class="close-exit-intent" title="Click to Copy" type="submit">
<input id="p2" class="p22" value="FREE16" />
<p id="p2" class="p22">FREE16</p>
</div> </a>
<p class="click2copy">Click to Copy ↗</p>
<p>No thanks</p>
</div>
</form>
Copytoclipboard js
function copyToClipboard(element) {
var $temp = $("<input>");
$("body").append($temp);
$temp.val($(element).text()).select();
document.execCommand("copy");
$temp.remove();
}
ImportVoucher js
function ImportVoucher(element) {
$('input[type=p2]').click(function(ev) {
ev.preventDefault();
$(this).siblings('input[type=p2]').removeClass('selected');
$(this).addClass('selected');
$('#sVoucher').val($('.selected').val());
$temp.remove();
}
added id into cart-footer
<input type="text" class="add-voucher--field is--medium block" id="sVoucher" name="sVoucher" placeholder="{"{s name='CheckoutFooterAddVoucherLabelInline'}{/s}"|escape}" />

I have implement 2 app in anugar js but not working

I have implemented 2 ng-app in single html page and it is not working for second one, Please look into my code and suggest me where I am wrong.
<div id="App1" ng-app="shoppingCart" ng-controller="ShoppingCartController">
<p>Name : <input type="text" data-ng-model="name"></p>
<h1>Hello {{name}}</h1>
<p> Name: <input type="text" id="first_name" ng-model="first_name"></p>
<h1 ng-bind="first_name"></h1>
<div ng-init="firstName='jaskaran'" id="firstName"></div>
<p> This is the first name:<span ng-bind="firstName"></span></p>
<p id ="x">
my first calculation {{5+5}}
</p>
</div>
<div id="App2" ng-app="namesList" ng-controller="NamesController" >
<input type="text" id="firstLast" ng-model="firstLast">
Full Name: {{firstLast}}
</div>
script here
var xApp = angular.module('shoppingCart',[])
xApp.controller ('ShoppingCartController', function($scope) {
}) ;
var app = angular.module('namesList',[])
app.controller('NamesController',function($scope){
$scope.firstLast = "Nitin" ;
});
Visit This URL You Can find the Solution
http://shrestha-manoj.blogspot.in/2014/06/can-angularjs-have-multiple-ng-app.html
only one AngularJS application can be auto-bootstrapped per HTML document. The first ngApp found in the document will be used to define the root element to auto-bootstrap as an application. To run multiple applications in an HTML document you must manually bootstrap them using angular.bootstrap instead.
Try this :
angular.bootstrap(document.getElementById("App2"), ['namesList']);
It will bootstrap your second ng-app directive.