Bonjour,
je dois utiliser ces deux codes javascript mais les deux veulent pas cohabiter.
je commente un le deuxième fonctionne bien .vis versa
le premier:
<script type="text/javascript">
$(document).ready(function(){
const buttons = document.querySelectorAll("button");
const currCalc = document.querySelector("#calculation");
const currInput = document.getElementById("inpresult");
const checkRE = /(\d|\))$/; // RegExp matches, if last character of string is number or ')'
const re1 = /(0+)$/g; // RegExp matches all 0 at the en of a string
const re2 = /\.$/; // RegExp matches dot at the end
let calc = [];
let input = [];
let res;
let intRes = false;
let disCalc = [];
let disResult;
let str;
function onNumber(el) {
// print number, unless user tries to input multiple zeros in the beginning & input-display is full
if (
((el === "0" && (input[0] !== "0" || input.includes("."))) || el !== "0") &&
input.length < 20
) {
input[0] === "0" && !input.includes(".") && el !== "0"
? (input = [])
: input;
input.push(el);
currInput.value = `${input.join("")}`;
}
}
function onClear(el) {
if (el === "c") {
// clear all
calc = [];
input = [];
intRes = false;
res = undefined;
displayCalculation(calc, false);
currInput.value = "";
// console.log(calc, input, negative, intRes, res);
} else if (el === "ce") {
// clear entry (input)
input = [];
currInput.value = "";
} else if (el === "del" && input.length > 0) {
// delete last input character
input.splice(-1);
currInput.value = `${input.join("")}`;
}
}
function onNeg() {
// toggle between ± only if input is not 0
if (input.length !== 0 && eval(input.join("")) !== 0) {
let negative;
input[0] === "-" ? (negative = true) : (negative = false);
// if-condition for display-reasons
if ((!negative && input.length < 20) || negative) {
negative ? input.shift() : input.unshift("-");
currInput.value = `${input.join("")}`;
}
}
}
function onDot() {
// print dot, unless input is already a decimal & condition for display-reasons
if (!input.includes(".") && input.length < 20) {
input.length > 0 ? input.push(".") : input.push("0", ".");
currInput.value = `${input.join("")}`;
}
}
function onOperator(operator) {
// eliminate redundant 0 from input end(re1), and dot if necessary(re2)
input.join("").includes(".") && re1.test(input.join(""))
? (input = input
.join("")
.replace(re1, "")
.replace(re2, "")
.split(""))
: input;
// run only, if input ends with checkRE OR
// calc isn't empty and ends with checkRE => || (calc.length > 0 && checkRE.test(calc))
if (checkRE.test(input)) {
// input in calc, dependend if input is negative or not ; then reset input
eval(input.join("")) < 0
? calc.push(`(${input.join("")})`)
: calc.push(`${input.join("")}`);
input = [];
// operator in calc
calc.push(operator);
// display current input and calc
displayCalculation(calc, false);
currInput.value = `${input.join("")}`;
}
}
function onEqual() {
// eliminate redundant 0 from input end(re1), and dot if necessary(re2)
input.join("").includes(".") && re1.test(input.join(""))
? input = input
.join("")
.replace(re1, "")
.replace(re2, "")
.split("")
: input;
// run only if input ends with checkRE
if (checkRE.test(input)) {
// input in calc, dependend if input is negative or not ; then reset input
eval(input.join("")) < 0
? calc.push(`(${input.join("")})`)
: calc.push(`${input.join("")}`);
input = [];
// resolve calculation, only if calc ends with checkRE
if (checkRE.test(calc)) {
res = eval(calc.join(""));
// display calculation and result
displayCalculation(calc, true);
displayResult(res);
}
}
}
function followUp(withIntRes) {
if (withIntRes) {
input = res.toString().split("");
}
calc = [];
res = undefined;
intRes = undefined;
currCalc.innerHTML = `${calc}`;
}
function displayResult(res) {
if (res > 99999999999999999999 || res < -9999999999999999999) {
disResult = "error";
calc = [];
input = [];
res = [];
intRes = false;
displayCalculation([], false);
} else {
disResult = res;
intRes = true;
}
currInput.value = `${disResult}`;
}
function displayCalculation(calcArr, final) {
final ? calcArr.push("=") : calcArr;
str = calcArr.join("");
if (str.length > 30) {
str = str.substr(-29);
disCalc = `…${str}`;
} else {
disCalc = str;
}
currCalc.innerHTML = disCalc;
}
function calculator() {
if (this.className === "number") {
if (intRes) {
followUp(false);
}
onNumber(this.id);
} else if (this.className === "clear") {
onClear(this.id);
} else if (this.id === "negative") {
if (intRes) {
followUp(true);
}
onNeg();
} else if (this.className === "dot") {
if (intRes) {
followUp(false);
}
onDot();
} else if (this.className === "operator") {
if (intRes) {
followUp(true);
}
onOperator(this.id);
} else if (this.className === "equal") {
onEqual();
}
}
buttons.forEach(button => button.addEventListener("click", calculator));
});
</script>
le deuxième
<script type="text/javascript">
// Get all the keys from document
var keys = document.querySelectorAll('#calculator span');
var operators = ['+', '-', 'x', '÷'];
var decimalAdded = false;
// Add onclick event to all the keys and perform operations
for(var i = 0; i < keys.length; i++) {
keys[i].onclick = function(e) {
// Get the input and button values
var input = document.getElementById("inpresult");
var inputVal = input.value;
var btnVal = this.innerHTML
// Now, just append the key values (btnValue) to the input string and finally use javascript's eval function to get the result
// If clear key is pressed, erase everything
if(btnVal == 'C') {
input.value = '';
decimalAdded = false;
}
// If eval key is pressed, calculate and display the result
else if(btnVal == '=') {
var equation = inputVal;
var lastChar = equation[equation.length - 1];
// Replace all instances of x and ÷ with * and / respectively. This can be done easily using regex and the 'g' tag which will replace all instances of the matched character/substring
equation = equation.replace(/x/g, '*').replace(/÷/g, '/');
// Final thing left to do is checking the last character of the equation. If it's an operator or a decimal, remove it
if(operators.indexOf(lastChar) > -1 || lastChar == '.')
equation = equation.replace(/.$/, '');
if(equation)
input.value = eval(equation);
decimalAdded = false;
}
// Basic functionality of the calculator is complete. But there are some problems like
// 1. No two operators should be added consecutively.
// 2. The equation shouldn't start from an operator except minus
// 3. not more than 1 decimal should be there in a number
// We'll fix these issues using some simple checks
// indexOf works only in IE9+
else if(operators.indexOf(btnVal) > -1) {
// Operator is clicked
// Get the last character from the equation
var lastChar = inputVal[inputVal.length - 1];
// Only add operator if input is not empty and there is no operator at the last
if(inputVal != '' && operators.indexOf(lastChar) == -1)
input.value += btnVal;
// Allow minus if the string is empty
else if(inputVal == '' && btnVal == '-')
input.value += btnVal;
// Replace the last operator (if exists) with the newly pressed operator
if(operators.indexOf(lastChar) > -1 && inputVal.length > 1) {
// Here, '.' matches any character while $ denotes the end of string, so anything (will be an operator in this case) at the end of string will get replaced by new operator
input.value = inputVal.replace(/.$/, btnVal);
}
decimalAdded =false;
}
// Now only the decimal problem is left. We can solve it easily using a flag 'decimalAdded' which we'll set once the decimal is added and prevent more decimals to be added once it's set. It will be reset when an operator, eval or clear key is pressed.input.innerHTML
else if(btnVal == '.') {
if(!decimalAdded) {
input.value += btnVal;
decimalAdded = true;
}
}
// if any other key is pressed, just append it
else {
input.value += btnVal;
}
// prevent page jumps
e.preventDefault();
}
}
</script>
Il faudrait que tu nous montres comment tu "mets" ces deux codes ensemble.
Il faudrait également regarder dans la console de ton navigateur si il n'y a pas des erreurs... (lorsque tu mets les deux codes ensemble bien entendu...)
=> Colle nous une capture écran de la console histoire qu'on se fasse notre propre avis...
<style type="text/css">
/* Basic reset */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
/* Better text styling */
font: bold 14px Arial, sans-serif;
}
/* Finally adding some IE9 fallbacks for gradients to finish things up */
/* A nice BG gradient */
html {
height: 100%;
background: white;
background: radial-gradient(circle, #fff 20%, #ccc);
background-size: cover;
}
/* Using box shadows to create 3D effects */
#calculator {
width: 325px;
height: auto;
margin: 100px auto;
padding: 20px 20px 9px;
background: #9dd2ea;
background: linear-gradient(#9dd2ea, #8bceec);
border-radius: 3px;
box-shadow: 0px 4px #009de4, 0px 10px 15px rgba(0, 0, 0, 0.2);
}
/* Top portion */
.top span.clear {
float: left;
}
/* Inset shadow on the screen to create indent */
.top .screen {
height: 40px;
width: 212px;
float: right;
padding: 0 10px;
background: rgba(0, 0, 0, 0.2);
border-radius: 3px;
box-shadow: inset 0px 4px rgba(0, 0, 0, 0.2);
/* Typography */
font-size: 17px;
line-height: 40px;
color: white;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
text-align: right;
letter-spacing: 1px;
}
/* Clear floats */
.keys, .top {overflow: hidden;}
/* Applying same to the keys */
.keys span, .top span.clear {
float: left;
position: relative;
top: 0;
cursor: pointer;
width: 66px;
height: 36px;
background: white;
border-radius: 3px;
box-shadow: 0px 4px rgba(0, 0, 0, 0.2);
margin: 0 7px 11px 0;
color: #888;
line-height: 36px;
text-align: center;
/* prevent selection of text inside keys */
user-select: none;
/* Smoothing out hover and active states using css3 transitions */
transition: all 0.2s ease;
}
/* Remove right margins from operator keys */
/* style different type of keys (operators/evaluate/clear) differently */
.keys span.operator {
background: #FFF0F5;
margin-right: 0;
}
.keys span.eval {
background: #f1ff92;
box-shadow: 0px 4px #9da853;
color: #888e5f;
}
.top span.clear {
background: #ff9fa8;
box-shadow: 0px 4px #ff7c87;
color: white;
}
/* Some hover effects */
.keys span:hover {
background: #9c89f6;
box-shadow: 0px 4px #6b54d3;
color: white;
}
.keys span.eval:hover {
background: #abb850;
box-shadow: 0px 4px #717a33;
color: #ffffff;
}
.top span.clear:hover {
background: #f68991;
box-shadow: 0px 4px #d3545d;
color: white;
}
/* Simulating "pressed" effect on active state of the keys by removing the box-shadow and moving the keys down a bit */
.keys span:active {
box-shadow: 0px 0px #6b54d3;
top: 4px;
}
.keys span.eval:active {
box-shadow: 0px 0px #717a33;
top: 4px;
}
.top span.clear:active {
top: 4px;
box-shadow: 0px 0px #d3545d;
}
</style>
<div id="calculator">
<!-- Screen and clear key -->
<div class="top">
<span class="clear">C</span>
<div class="screen">
<input type="text" name="qte" id="inpresult" value="" style="font-size: 36px; text-align: left; color: red; font-weight: bold;" >
</div>
</div>
<div class="keys">
<!-- operators and other keys -->
<span>7</span>
<span>8</span>
<span>9</span>
<span>4</span>
<span>5</span>
<span>6</span>
<span>1</span>
<span>2</span>
<span>3</span>
<span>0</span>
</div>
<hr class="mb-4">
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6">
<input onclick="inserer2()" type="button" name="valider" class="btn btn-success btn-block flatbtn" value="Appliquez un pourcentage">
</div>
<div class="col-md-3"></div>
</div>
</div>
<script type="text/javascript">
// Get all the keys from document
var keys = document.querySelectorAll('#calculator span');
var operators = ['+', '-', 'x', '÷'];
var decimalAdded = false;
// Add onclick event to all the keys and perform operations
for(var i = 0; i < keys.length; i++) {
keys[i].onclick = function(e) {
// Get the input and button values
var input = document.getElementById("inpresult");
var inputVal = input.value;
var btnVal = this.innerHTML
// Now, just append the key values (btnValue) to the input string and finally use javascript's eval function to get the result
// If clear key is pressed, erase everything
if(btnVal == 'C') {
input.value = '';
decimalAdded = false;
}
// If eval key is pressed, calculate and display the result
else if(btnVal == '=') {
var equation = inputVal;
var lastChar = equation[equation.length - 1];
// Replace all instances of x and ÷ with * and / respectively. This can be done easily using regex and the 'g' tag which will replace all instances of the matched character/substring
equation = equation.replace(/x/g, '*').replace(/÷/g, '/');
// Final thing left to do is checking the last character of the equation. If it's an operator or a decimal, remove it
if(operators.indexOf(lastChar) > -1 || lastChar == '.')
equation = equation.replace(/.$/, '');
if(equation)
input.value = eval(equation);
decimalAdded = false;
}
// Basic functionality of the calculator is complete. But there are some problems like
// 1. No two operators should be added consecutively.
// 2. The equation shouldn't start from an operator except minus
// 3. not more than 1 decimal should be there in a number
// We'll fix these issues using some simple checks
// indexOf works only in IE9+
else if(operators.indexOf(btnVal) > -1) {
// Operator is clicked
// Get the last character from the equation
var lastChar = inputVal[inputVal.length - 1];
// Only add operator if input is not empty and there is no operator at the last
if(inputVal != '' && operators.indexOf(lastChar) == -1)
input.value += btnVal;
// Allow minus if the string is empty
else if(inputVal == '' && btnVal == '-')
input.value += btnVal;
// Replace the last operator (if exists) with the newly pressed operator
if(operators.indexOf(lastChar) > -1 && inputVal.length > 1) {
// Here, '.' matches any character while $ denotes the end of string, so anything (will be an operator in this case) at the end of string will get replaced by new operator
input.value = inputVal.replace(/.$/, btnVal);
}
decimalAdded =false;
}
// Now only the decimal problem is left. We can solve it easily using a flag 'decimalAdded' which we'll set once the decimal is added and prevent more decimals to be added once it's set. It will be reset when an operator, eval or clear key is pressed.input.innerHTML
else if(btnVal == '.') {
if(!decimalAdded) {
input.value += btnVal;
decimalAdded = true;
}
}
// if any other key is pressed, just append it
else {
input.value += btnVal;
}
// prevent page jumps
e.preventDefault();
}
}
</script>
et
<?php include('calculator.php'); ?>
<form >
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6">
<label for="firstName"></label>
<div class="invalid-feedback"></div>
</div>
<div class="col-md-3"></div>
</div>
<br>
<div class="calculator">
<div class="output">
<div id="calculation">
<!-- Display for calculation -->
</div>
<div id="input">
<!-- Display for Input & Result -->
<input type="text" name="qte" id="inpresult" value="" style="font-size: 36px; text-align: center; color: red; font-weight: bold;" >
<input id="cache" hidden type="text" name="id" value="">
<input id="clef" hidden type="text" name="clef" value="<?php echo $_GET['clef']; ?>">
</div>
</div>
<div class="button-field">
<button type="button" id="c" class="clear" name="clear"><span>c</span></button>
<button type="button" id="ce" class="clear" name="clear-entry"><span>ce</span></button>
<button type="button" id="0" class="number" name="0">0</button>
<button type="button" id="7" class="number" name="7">7</button>
<button type="button" id="8" class="number" name="8">8</button>
<button type="button" id="9" class="number" name="9">9</button>
<button type="button" id="4" class="number" name="4">4</button>
<button type="button" id="5" class="number" name="5">5</button>
<button type="button" id="6" class="number" name="6">6</button>
<button type="button" id="1" class="number" name="1">1</button>
<button type="button" id="2" class="number" name="2">2</button>
<button type="button" id="3" class="number" name="3">3</button>
</div>
</div>
<hr class="mb-4">
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6">
<input onclick="inserer()" type="button" name="valider" class="btn btn-success btn-block flatbtn" value="Modiffier">
</div>
<div class="col-md-3"></div>
</div>
</form>
<script type="text/javascript">
$(document).ready(function(){
const buttons = document.querySelectorAll("button");
const currCalc = document.querySelector("#calculation");
const currInput = document.getElementById("inpresult");
const checkRE = /(\d|\))$/; // RegExp matches, if last character of string is number or ')'
const re1 = /(0+)$/g; // RegExp matches all 0 at the en of a string
const re2 = /\.$/; // RegExp matches dot at the end
let calc = [];
let input = [];
let res;
let intRes = false;
let disCalc = [];
let disResult;
let str;
function onNumber(el) {
// print number, unless user tries to input multiple zeros in the beginning & input-display is full
if (
((el === "0" && (input[0] !== "0" || input.includes("."))) || el !== "0") &&
input.length < 20
) {
input[0] === "0" && !input.includes(".") && el !== "0"
? (input = [])
: input;
input.push(el);
currInput.value = `${input.join("")}`;
}
}
function onClear(el) {
if (el === "c") {
// clear all
calc = [];
input = [];
intRes = false;
res = undefined;
displayCalculation(calc, false);
currInput.value = "";
// console.log(calc, input, negative, intRes, res);
} else if (el === "ce") {
// clear entry (input)
input = [];
currInput.value = "";
} else if (el === "del" && input.length > 0) {
// delete last input character
input.splice(-1);
currInput.value = `${input.join("")}`;
}
}
function onNeg() {
// toggle between ± only if input is not 0
if (input.length !== 0 && eval(input.join("")) !== 0) {
let negative;
input[0] === "-" ? (negative = true) : (negative = false);
// if-condition for display-reasons
if ((!negative && input.length < 20) || negative) {
negative ? input.shift() : input.unshift("-");
currInput.value = `${input.join("")}`;
}
}
}
function onDot() {
// print dot, unless input is already a decimal & condition for display-reasons
if (!input.includes(".") && input.length < 20) {
input.length > 0 ? input.push(".") : input.push("0", ".");
currInput.value = `${input.join("")}`;
}
}
function onOperator(operator) {
// eliminate redundant 0 from input end(re1), and dot if necessary(re2)
input.join("").includes(".") && re1.test(input.join(""))
? (input = input
.join("")
.replace(re1, "")
.replace(re2, "")
.split(""))
: input;
// run only, if input ends with checkRE OR
// calc isn't empty and ends with checkRE => || (calc.length > 0 && checkRE.test(calc))
if (checkRE.test(input)) {
// input in calc, dependend if input is negative or not ; then reset input
eval(input.join("")) < 0
? calc.push(`(${input.join("")})`)
: calc.push(`${input.join("")}`);
input = [];
// operator in calc
calc.push(operator);
// display current input and calc
displayCalculation(calc, false);
currInput.value = `${input.join("")}`;
}
}
function onEqual() {
// eliminate redundant 0 from input end(re1), and dot if necessary(re2)
input.join("").includes(".") && re1.test(input.join(""))
? input = input
.join("")
.replace(re1, "")
.replace(re2, "")
.split("")
: input;
// run only if input ends with checkRE
if (checkRE.test(input)) {
// input in calc, dependend if input is negative or not ; then reset input
eval(input.join("")) < 0
? calc.push(`(${input.join("")})`)
: calc.push(`${input.join("")}`);
input = [];
// resolve calculation, only if calc ends with checkRE
if (checkRE.test(calc)) {
res = eval(calc.join(""));
// display calculation and result
displayCalculation(calc, true);
displayResult(res);
}
}
}
function followUp(withIntRes) {
if (withIntRes) {
input = res.toString().split("");
}
calc = [];
res = undefined;
intRes = undefined;
currCalc.innerHTML = `${calc}`;
}
function displayResult(res) {
if (res > 99999999999999999999 || res < -9999999999999999999) {
disResult = "error";
calc = [];
input = [];
res = [];
intRes = false;
displayCalculation([], false);
} else {
disResult = res;
intRes = true;
}
currInput.value = `${disResult}`;
}
function displayCalculation(calcArr, final) {
final ? calcArr.push("=") : calcArr;
str = calcArr.join("");
if (str.length > 30) {
str = str.substr(-29);
disCalc = `…${str}`;
} else {
disCalc = str;
}
currCalc.innerHTML = disCalc;
}
function calculator() {
if (this.className === "number") {
if (intRes) {
followUp(false);
}
onNumber(this.id);
} else if (this.className === "clear") {
onClear(this.id);
} else if (this.id === "negative") {
if (intRes) {
followUp(true);
}
onNeg();
} else if (this.className === "dot") {
if (intRes) {
followUp(false);
}
onDot();
} else if (this.className === "operator") {
if (intRes) {
followUp(true);
}
onOperator(this.id);
} else if (this.className === "equal") {
onEqual();
}
}
buttons.forEach(button => button.addEventListener("click", calculator));
});
</script>
Tu ne nous donnes que des bouts de code...
Il manque tout le reste du html ... les imports JS ...etc...
Donc... donne nous le code complet de la page générée dans le navigateur (je dis bien le code "généré" ... que tu peux récupérer en affichant la page dans ton navigateur puis en en affichant le code source via le raccourci clavier CTRL+U
Si tu mets en commentaire cette ligne et que tu réutilise celle d'avant (qui est en commentaire quelques lignes plus haut, pointant sur le cdn jquery )
Dans le fichier placerModalPourcentage.js
Modifie le comme ceci :
//const links = document.getElementById('tableau').getElementsByTagName('a') ;
function placer(arg){
var idInput = document.getElementById('cache') ;
var qteInput = document.getElementById('inpresult') ;
qteInput.setAttribute('value',arg.textContent) ;
idInput.setAttribute('value',arg.id) ;
}
Ensuite, dans les erreurs affichées dans la console, ça parle de "placer2"
Mais je ne trouve nul-part dans le code que tu nous montres référence à cette fonction (appellées via un onclick visiblement)...
Tu peux éventuellement cliquer sur le "nom du fichier" indiqué dans la console en regard du message d'erreur... ça devrait t'afficher la ligne de code concernée.
Tu peux déjà commencer par corriger ça.
Ensuite,
Dis toi, lorsque tu essayes de regrouper plusieurs codes ensembles :
1- Ne pas utiliser les mêmes noms de fonctions
2 - Ne pas utiliser les mêmes noms de variables à portée "globales". (si tu les déclares à l'intérieur des fonctions cela ne pose pas de souci)
Et si malgré ces ajustements les soucis persistes, recolle nous les éventuels nouveaux messages d'erreurs de la console et donne nous le code de chaque fichier js (en pensant à nous spécifier le nom de chacun )
Bonjour à vous .
il a y une avancée mais quand je sais le chiffres de la calculette, ca ne s'affiche pas dans le input .
partie concernée :
<style type="text/css">
/* Basic reset */
* {
margin: 0;
padding: 0;
box-sizing: border-box;
/* Better text styling */
font: bold 14px Arial, sans-serif;
}
/* Finally adding some IE9 fallbacks for gradients to finish things up */
/* A nice BG gradient */
html {
height: 100%;
background: white;
background: radial-gradient(circle, #fff 20%, #ccc);
background-size: cover;
}
/* Using box shadows to create 3D effects */
#calculator {
width: 325px;
height: auto;
margin: 100px auto;
padding: 20px 20px 9px;
background: #9dd2ea;
background: linear-gradient(#9dd2ea, #8bceec);
border-radius: 3px;
box-shadow: 0px 4px #009de4, 0px 10px 15px rgba(0, 0, 0, 0.2);
}
/* Top portion */
.top span.clear {
float: left;
}
/* Inset shadow on the screen to create indent */
.top .screen {
height: 40px;
width: 212px;
float: right;
padding: 0 10px;
background: rgba(0, 0, 0, 0.2);
border-radius: 3px;
box-shadow: inset 0px 4px rgba(0, 0, 0, 0.2);
/* Typography */
font-size: 17px;
line-height: 40px;
color: white;
text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2);
text-align: right;
letter-spacing: 1px;
}
/* Clear floats */
.keys, .top {overflow: hidden;}
/* Applying same to the keys */
.keys span, .top span.clear {
float: left;
position: relative;
top: 0;
cursor: pointer;
width: 66px;
height: 36px;
background: white;
border-radius: 3px;
box-shadow: 0px 4px rgba(0, 0, 0, 0.2);
margin: 0 7px 11px 0;
color: #888;
line-height: 36px;
text-align: center;
/* prevent selection of text inside keys */
user-select: none;
/* Smoothing out hover and active states using css3 transitions */
transition: all 0.2s ease;
}
/* Remove right margins from operator keys */
/* style different type of keys (operators/evaluate/clear) differently */
.keys span.operator {
background: #FFF0F5;
margin-right: 0;
}
.keys span.eval {
background: #f1ff92;
box-shadow: 0px 4px #9da853;
color: #888e5f;
}
.top span.clear {
background: #ff9fa8;
box-shadow: 0px 4px #ff7c87;
color: white;
}
/* Some hover effects */
.keys span:hover {
background: #9c89f6;
box-shadow: 0px 4px #6b54d3;
color: white;
}
.keys span.eval:hover {
background: #abb850;
box-shadow: 0px 4px #717a33;
color: #ffffff;
}
.top span.clear:hover {
background: #f68991;
box-shadow: 0px 4px #d3545d;
color: white;
}
/* Simulating "pressed" effect on active state of the keys by removing the box-shadow and moving the keys down a bit */
.keys span:active {
box-shadow: 0px 0px #6b54d3;
top: 4px;
}
.keys span.eval:active {
box-shadow: 0px 0px #717a33;
top: 4px;
}
.top span.clear:active {
top: 4px;
box-shadow: 0px 0px #d3545d;
}
</style>
<div id="calculator">
<!-- Screen and clear key -->
<div class="top">
<span class="clear">C</span>
<div class="screen">
<input type="text" name="qte" id="inpresult2" value="" style="font-size: 36px; text-align: left; color: red; font-weight: bold;" >
<input id="cache2" hidden type="text" name="id" value="">
<input id="clef" hidden type="text" name="clef" value="<?php echo $_GET['clef']; ?>">
</div>
</div>
<div class="keys">
<!-- operators and other keys -->
<span>7</span>
<span>8</span>
<span>9</span>
<span>4</span>
<span>5</span>
<span>6</span>
<span>1</span>
<span>2</span>
<span>3</span>
<span>0</span>
</div>
<hr class="mb-4">
<div class="row">
<div class="col-md-3"></div>
<div class="col-md-6">
<input onclick="inserer2()" type="button" name="valider" class="btn btn-success btn-block flatbtn" value="Appliquez un pourcentage">
</div>
<div class="col-md-3"></div>
</div>
</div>
<script type="text/javascript">
// Get all the keys from document
var keys = document.querySelectorAll('#calculator span');
var operators = ['+', '-', 'x', '÷'];
var decimalAdded = false;
// Add onclick event to all the keys and perform operations
for(var i = 0; i < keys.length; i++) {
keys[i].onclick = function(e) {
// Get the input and button values
var input = document.getElementById("inpresult");
var inputVal = input.value;
var btnVal = this.innerHTML
// Now, just append the key values (btnValue) to the input string and finally use javascript's eval function to get the result
// If clear key is pressed, erase everything
if(btnVal == 'C') {
input.value = '';
decimalAdded = false;
}
// If eval key is pressed, calculate and display the result
else if(btnVal == '=') {
var equation = inputVal;
var lastChar = equation[equation.length - 1];
// Replace all instances of x and ÷ with * and / respectively. This can be done easily using regex and the 'g' tag which will replace all instances of the matched character/substring
equation = equation.replace(/x/g, '*').replace(/÷/g, '/');
// Final thing left to do is checking the last character of the equation. If it's an operator or a decimal, remove it
if(operators.indexOf(lastChar) > -1 || lastChar == '.')
equation = equation.replace(/.$/, '');
if(equation)
input.value = eval(equation);
decimalAdded = false;
}
// Basic functionality of the calculator is complete. But there are some problems like
// 1. No two operators should be added consecutively.
// 2. The equation shouldn't start from an operator except minus
// 3. not more than 1 decimal should be there in a number
// We'll fix these issues using some simple checks
// indexOf works only in IE9+
else if(operators.indexOf(btnVal) > -1) {
// Operator is clicked
// Get the last character from the equation
var lastChar = inputVal[inputVal.length - 1];
// Only add operator if input is not empty and there is no operator at the last
if(inputVal != '' && operators.indexOf(lastChar) == -1)
input.value += btnVal;
// Allow minus if the string is empty
else if(inputVal == '' && btnVal == '-')
input.value += btnVal;
// Replace the last operator (if exists) with the newly pressed operator
if(operators.indexOf(lastChar) > -1 && inputVal.length > 1) {
// Here, '.' matches any character while $ denotes the end of string, so anything (will be an operator in this case) at the end of string will get replaced by new operator
input.value = inputVal.replace(/.$/, btnVal);
}
decimalAdded =false;
}
// Now only the decimal problem is left. We can solve it easily using a flag 'decimalAdded' which we'll set once the decimal is added and prevent more decimals to be added once it's set. It will be reset when an operator, eval or clear key is pressed.input.innerHTML
else if(btnVal == '.') {
if(!decimalAdded) {
input.value += btnVal;
decimalAdded = true;
}
}
// if any other key is pressed, just append it
else {
input.value += btnVal;
}
// prevent page jumps
e.preventDefault();
}
}
</script>
Je t'ai indiqué de regarder dans la console (mais tu sembles avoir du mal à comprendre ce qu'on te dit... )
par ce que... ben..... oui... il y a bien un message d'erreur qui dit que la variable input est inconnue
à la ligne
- Messages postés
-
500
- Date d'inscription
- lundi 24 août 2009
- Statut
- Membre
- Dernière intervention
- 13 avril 2021
130 janv. 2019 à 22:05
<div class="modal fade" id="squarespaceModal" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button> <h3 class="modal-title" id="lineModalLabel">Réduction de cout</h3> </div> <div class="modal-body"> <!-- content goes here --> <?php include('modalPourcentage.php'); ?> </div> <div class="modal-footer"> <div class="btn-group btn-group-justified" role="group" aria-label="group button"> <div class="btn-group" role="group"> <button type="button" class="btn btn-default" data-dismiss="modal" role="button">Close</button> </div> <div class="btn-group btn-delete hidden" role="group"> <button type="button" id="delImage" class="btn btn-default btn-hover-red" data-dismiss="modal" role="button">Delete</button> </div> <div class="btn-group" role="group"> <button type="button" id="saveImage" class="btn btn-default btn-hover-green" data-action="save" role="button"></button> </div> </div> </div> </div> </div> </div> <div class="modal fade" id="login-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;"> <div class="modal-dialog"> <div class="loginmodal-container"> <?php include('calculator.php'); ?> </div> </div> </div>avec
<?php include('modalPourcentage.php'); ?>:<style type="text/css"> /* Basic reset */ * { margin: 0; padding: 0; box-sizing: border-box; /* Better text styling */ font: bold 14px Arial, sans-serif; } /* Finally adding some IE9 fallbacks for gradients to finish things up */ /* A nice BG gradient */ html { height: 100%; background: white; background: radial-gradient(circle, #fff 20%, #ccc); background-size: cover; } /* Using box shadows to create 3D effects */ #calculator { width: 325px; height: auto; margin: 100px auto; padding: 20px 20px 9px; background: #9dd2ea; background: linear-gradient(#9dd2ea, #8bceec); border-radius: 3px; box-shadow: 0px 4px #009de4, 0px 10px 15px rgba(0, 0, 0, 0.2); } /* Top portion */ .top span.clear { float: left; } /* Inset shadow on the screen to create indent */ .top .screen { height: 40px; width: 212px; float: right; padding: 0 10px; background: rgba(0, 0, 0, 0.2); border-radius: 3px; box-shadow: inset 0px 4px rgba(0, 0, 0, 0.2); /* Typography */ font-size: 17px; line-height: 40px; color: white; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); text-align: right; letter-spacing: 1px; } /* Clear floats */ .keys, .top {overflow: hidden;} /* Applying same to the keys */ .keys span, .top span.clear { float: left; position: relative; top: 0; cursor: pointer; width: 66px; height: 36px; background: white; border-radius: 3px; box-shadow: 0px 4px rgba(0, 0, 0, 0.2); margin: 0 7px 11px 0; color: #888; line-height: 36px; text-align: center; /* prevent selection of text inside keys */ user-select: none; /* Smoothing out hover and active states using css3 transitions */ transition: all 0.2s ease; } /* Remove right margins from operator keys */ /* style different type of keys (operators/evaluate/clear) differently */ .keys span.operator { background: #FFF0F5; margin-right: 0; } .keys span.eval { background: #f1ff92; box-shadow: 0px 4px #9da853; color: #888e5f; } .top span.clear { background: #ff9fa8; box-shadow: 0px 4px #ff7c87; color: white; } /* Some hover effects */ .keys span:hover { background: #9c89f6; box-shadow: 0px 4px #6b54d3; color: white; } .keys span.eval:hover { background: #abb850; box-shadow: 0px 4px #717a33; color: #ffffff; } .top span.clear:hover { background: #f68991; box-shadow: 0px 4px #d3545d; color: white; } /* Simulating "pressed" effect on active state of the keys by removing the box-shadow and moving the keys down a bit */ .keys span:active { box-shadow: 0px 0px #6b54d3; top: 4px; } .keys span.eval:active { box-shadow: 0px 0px #717a33; top: 4px; } .top span.clear:active { top: 4px; box-shadow: 0px 0px #d3545d; } </style> <div id="calculator"> <!-- Screen and clear key --> <div class="top"> <span class="clear">C</span> <div class="screen"> <input type="text" name="qte" id="inpresult" value="" style="font-size: 36px; text-align: left; color: red; font-weight: bold;" > </div> </div> <div class="keys"> <!-- operators and other keys --> <span>7</span> <span>8</span> <span>9</span> <span>4</span> <span>5</span> <span>6</span> <span>1</span> <span>2</span> <span>3</span> <span>0</span> </div> <hr class="mb-4"> <div class="row"> <div class="col-md-3"></div> <div class="col-md-6"> <input onclick="inserer2()" type="button" name="valider" class="btn btn-success btn-block flatbtn" value="Appliquez un pourcentage"> </div> <div class="col-md-3"></div> </div> </div> <script type="text/javascript"> // Get all the keys from document var keys = document.querySelectorAll('#calculator span'); var operators = ['+', '-', 'x', '÷']; var decimalAdded = false; // Add onclick event to all the keys and perform operations for(var i = 0; i < keys.length; i++) { keys[i].onclick = function(e) { // Get the input and button values var input = document.getElementById("inpresult"); var inputVal = input.value; var btnVal = this.innerHTML // Now, just append the key values (btnValue) to the input string and finally use javascript's eval function to get the result // If clear key is pressed, erase everything if(btnVal == 'C') { input.value = ''; decimalAdded = false; } // If eval key is pressed, calculate and display the result else if(btnVal == '=') { var equation = inputVal; var lastChar = equation[equation.length - 1]; // Replace all instances of x and ÷ with * and / respectively. This can be done easily using regex and the 'g' tag which will replace all instances of the matched character/substring equation = equation.replace(/x/g, '*').replace(/÷/g, '/'); // Final thing left to do is checking the last character of the equation. If it's an operator or a decimal, remove it if(operators.indexOf(lastChar) > -1 || lastChar == '.') equation = equation.replace(/.$/, ''); if(equation) input.value = eval(equation); decimalAdded = false; } // Basic functionality of the calculator is complete. But there are some problems like // 1. No two operators should be added consecutively. // 2. The equation shouldn't start from an operator except minus // 3. not more than 1 decimal should be there in a number // We'll fix these issues using some simple checks // indexOf works only in IE9+ else if(operators.indexOf(btnVal) > -1) { // Operator is clicked // Get the last character from the equation var lastChar = inputVal[inputVal.length - 1]; // Only add operator if input is not empty and there is no operator at the last if(inputVal != '' && operators.indexOf(lastChar) == -1) input.value += btnVal; // Allow minus if the string is empty else if(inputVal == '' && btnVal == '-') input.value += btnVal; // Replace the last operator (if exists) with the newly pressed operator if(operators.indexOf(lastChar) > -1 && inputVal.length > 1) { // Here, '.' matches any character while $ denotes the end of string, so anything (will be an operator in this case) at the end of string will get replaced by new operator input.value = inputVal.replace(/.$/, btnVal); } decimalAdded =false; } // Now only the decimal problem is left. We can solve it easily using a flag 'decimalAdded' which we'll set once the decimal is added and prevent more decimals to be added once it's set. It will be reset when an operator, eval or clear key is pressed.input.innerHTML else if(btnVal == '.') { if(!decimalAdded) { input.value += btnVal; decimalAdded = true; } } // if any other key is pressed, just append it else { input.value += btnVal; } // prevent page jumps e.preventDefault(); } } </script>et
<?php include('calculator.php'); ?><form > <div class="row"> <div class="col-md-3"></div> <div class="col-md-6"> <label for="firstName"></label> <div class="invalid-feedback"></div> </div> <div class="col-md-3"></div> </div> <br> <div class="calculator"> <div class="output"> <div id="calculation"> <!-- Display for calculation --> </div> <div id="input"> <!-- Display for Input & Result --> <input type="text" name="qte" id="inpresult" value="" style="font-size: 36px; text-align: center; color: red; font-weight: bold;" > <input id="cache" hidden type="text" name="id" value=""> <input id="clef" hidden type="text" name="clef" value="<?php echo $_GET['clef']; ?>"> </div> </div> <div class="button-field"> <button type="button" id="c" class="clear" name="clear"><span>c</span></button> <button type="button" id="ce" class="clear" name="clear-entry"><span>ce</span></button> <button type="button" id="0" class="number" name="0">0</button> <button type="button" id="7" class="number" name="7">7</button> <button type="button" id="8" class="number" name="8">8</button> <button type="button" id="9" class="number" name="9">9</button> <button type="button" id="4" class="number" name="4">4</button> <button type="button" id="5" class="number" name="5">5</button> <button type="button" id="6" class="number" name="6">6</button> <button type="button" id="1" class="number" name="1">1</button> <button type="button" id="2" class="number" name="2">2</button> <button type="button" id="3" class="number" name="3">3</button> </div> </div> <hr class="mb-4"> <div class="row"> <div class="col-md-3"></div> <div class="col-md-6"> <input onclick="inserer()" type="button" name="valider" class="btn btn-success btn-block flatbtn" value="Modiffier"> </div> <div class="col-md-3"></div> </div> </form> <script type="text/javascript"> $(document).ready(function(){ const buttons = document.querySelectorAll("button"); const currCalc = document.querySelector("#calculation"); const currInput = document.getElementById("inpresult"); const checkRE = /(\d|\))$/; // RegExp matches, if last character of string is number or ')' const re1 = /(0+)$/g; // RegExp matches all 0 at the en of a string const re2 = /\.$/; // RegExp matches dot at the end let calc = []; let input = []; let res; let intRes = false; let disCalc = []; let disResult; let str; function onNumber(el) { // print number, unless user tries to input multiple zeros in the beginning & input-display is full if ( ((el === "0" && (input[0] !== "0" || input.includes("."))) || el !== "0") && input.length < 20 ) { input[0] === "0" && !input.includes(".") && el !== "0" ? (input = []) : input; input.push(el); currInput.value = `${input.join("")}`; } } function onClear(el) { if (el === "c") { // clear all calc = []; input = []; intRes = false; res = undefined; displayCalculation(calc, false); currInput.value = ""; // console.log(calc, input, negative, intRes, res); } else if (el === "ce") { // clear entry (input) input = []; currInput.value = ""; } else if (el === "del" && input.length > 0) { // delete last input character input.splice(-1); currInput.value = `${input.join("")}`; } } function onNeg() { // toggle between ± only if input is not 0 if (input.length !== 0 && eval(input.join("")) !== 0) { let negative; input[0] === "-" ? (negative = true) : (negative = false); // if-condition for display-reasons if ((!negative && input.length < 20) || negative) { negative ? input.shift() : input.unshift("-"); currInput.value = `${input.join("")}`; } } } function onDot() { // print dot, unless input is already a decimal & condition for display-reasons if (!input.includes(".") && input.length < 20) { input.length > 0 ? input.push(".") : input.push("0", "."); currInput.value = `${input.join("")}`; } } function onOperator(operator) { // eliminate redundant 0 from input end(re1), and dot if necessary(re2) input.join("").includes(".") && re1.test(input.join("")) ? (input = input .join("") .replace(re1, "") .replace(re2, "") .split("")) : input; // run only, if input ends with checkRE OR // calc isn't empty and ends with checkRE => || (calc.length > 0 && checkRE.test(calc)) if (checkRE.test(input)) { // input in calc, dependend if input is negative or not ; then reset input eval(input.join("")) < 0 ? calc.push(`(${input.join("")})`) : calc.push(`${input.join("")}`); input = []; // operator in calc calc.push(operator); // display current input and calc displayCalculation(calc, false); currInput.value = `${input.join("")}`; } } function onEqual() { // eliminate redundant 0 from input end(re1), and dot if necessary(re2) input.join("").includes(".") && re1.test(input.join("")) ? input = input .join("") .replace(re1, "") .replace(re2, "") .split("") : input; // run only if input ends with checkRE if (checkRE.test(input)) { // input in calc, dependend if input is negative or not ; then reset input eval(input.join("")) < 0 ? calc.push(`(${input.join("")})`) : calc.push(`${input.join("")}`); input = []; // resolve calculation, only if calc ends with checkRE if (checkRE.test(calc)) { res = eval(calc.join("")); // display calculation and result displayCalculation(calc, true); displayResult(res); } } } function followUp(withIntRes) { if (withIntRes) { input = res.toString().split(""); } calc = []; res = undefined; intRes = undefined; currCalc.innerHTML = `${calc}`; } function displayResult(res) { if (res > 99999999999999999999 || res < -9999999999999999999) { disResult = "error"; calc = []; input = []; res = []; intRes = false; displayCalculation([], false); } else { disResult = res; intRes = true; } currInput.value = `${disResult}`; } function displayCalculation(calcArr, final) { final ? calcArr.push("=") : calcArr; str = calcArr.join(""); if (str.length > 30) { str = str.substr(-29); disCalc = `…${str}`; } else { disCalc = str; } currCalc.innerHTML = disCalc; } function calculator() { if (this.className === "number") { if (intRes) { followUp(false); } onNumber(this.id); } else if (this.className === "clear") { onClear(this.id); } else if (this.id === "negative") { if (intRes) { followUp(true); } onNeg(); } else if (this.className === "dot") { if (intRes) { followUp(false); } onDot(); } else if (this.className === "operator") { if (intRes) { followUp(true); } onOperator(this.id); } else if (this.className === "equal") { onEqual(); } } buttons.forEach(button => button.addEventListener("click", calculator)); }); </script>voici le capture de la console
- Messages postés
-
35409
- Date d'inscription
- mercredi 22 octobre 2003
- Statut
- Modérateur
- Dernière intervention
- 16 mai 2022
35630 janv. 2019 à 23:28
Il manque tout le reste du html ... les imports JS ...etc...
Donc... donne nous le code complet de la page générée dans le navigateur (je dis bien le code "généré" ... que tu peux récupérer en affichant la page dans ton navigateur puis en en affichant le code source via le raccourci clavier CTRL+U
- Messages postés
-
500
- Date d'inscription
- lundi 24 août 2009
- Statut
- Membre
- Dernière intervention
- 13 avril 2021
130 janv. 2019 à 23:36
<!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <!-- This file has been downloaded from Bootsnipp.com. Enjoy! --> <title>FACTURA</title> <meta name="viewport" content="width=device-width, initial-scale=1"> <!-- <link href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="css/style.css"> <script src="http://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> --> <link href="css/template/maxcdn.bootstrapcdn.com.bootstrap.min.css" rel="stylesheet"> <link rel="stylesheet" href="css/stackpath.bootstrapcdn.com.font.awesome.4.7.0.css.font.awesomemin.css"> <script src="js/template/code.jquery.jquery-1.11.1.min.js"></script> <script> function popupCenter(url, title, w, h, t) { var left = (screen.width/2)-(w/2); var top = (screen.height/2)-(h/2); return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+t+', left='+left); } </script> <script> function confirmDelete(delUrl) { if (confirm("Voulez vous vraiment supprimer cette famille ?")) { document.location = delUrl; } } </script> <script type="text/javascript" src="http://jqueryjs.googlecode.com/files/jquery-1.3.1.min.js" > </script> <script language="javascript"> function ouvre_popup(page) { window.open(page,"nom_popup","menubar=no, status=no, scrollbars=yes, width=2480, height=3508"); } </SCRIPT> </head> <body> <script src="js/template/maxcdn.bootstrapcdn.bootstrap.min.js"></script> <link rel="stylesheet" href="css/style.css"> <nav class="navbar navbar-inverse navbar-fixed-top" id="jntopnav"> <div class="container-fluid"> <!-- Brand and toggle get grouped for better mobile display --> <div class="navbar-header"> <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1" aria-expanded="false"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> <a class="navbar-brand" href="#"><img src="images/LOGO_GLOBAL_AEITok3Petit.jpg" width="20" height="20"></a> <a class="navbar-brand" href="siteWeb/site_web.php?clef=bc01Tm89">FACTURA</a> </div> <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="nav navbar-nav"> <li><a href="#" style="color: yellow">MAG : GTS</a></li> <li><a href="index.php?page=ACCUEIL">Accueil</a></li> <li><a href="#" class="active">SI</a></li> <li><a href="#">Aide</a></li> <li><a href="index.php?page=sms">SMS</a></li> <li><a href="index.php?page=CODEBAR">Code Barre</a></li> <li><a href="#">Contacts</a></li> <li> <IFRAME id=membres title=membres frameBorder=0 width=1 height=1 scrolling=yes name=membres src="code/update_seuil.php" marginWidth=0 marginHeight=0> </IFRAME> </li> <li> <a data-toggle="tooltip" data-placement="right" title="Alerte reservation" onclick="popupCenter('index.php?page=list_facture&id_reser=reserv&status=1', 'myPop1',960,600,5);" href="javascript:void(0);" > <span class="glyphicon glyphicon-time"></span> 0</a> </li> <li> <a data-toggle="tooltip" data-placement="right" title="Stock Bas" onclick="popupCenter('index.php?page=valeurstock&vals=1', 'myPop1',960,600,5);" href="javascript:void(0);" ><span class="glyphicon glyphicon-warning-sign" style="color: white"></span><span class="badge" style="color: red; background-color: white">2</span></a> </li> <li> <!-- <IFRAME id=membres title=membres frameBorder=0 width=1 height=1 scrolling=yes name=membres src="code/envoi_sms_client.php" marginWidth=0 marginHeight=0> </IFRAME> --> </li> <li> <IFRAME id=membres title=membres frameBorder=0 width=1 height=1 scrolling=yes name=membres src="code/UpdateValeurStock.php" marginWidth=0 marginHeight=0> </IFRAME> </li> <li> <a data-toggle="tooltip" data-placement="right" title="sms" onclick="popupCenter('code/envoi_sms_client.php', 'myPop1',960,600,5);" href="javascript:void(0);" ><span class="glyphicon glyphicon-warning-sign" style="color: white"></span><span class="badge" style="color: white; background-color: red"> 37/15=-22 </span></a> </li> </ul> <ul class="nav navbar-nav navbar-right"> <li><a href="code/portable.php?pc=1">Portable</a></li> <li><a href="chicsape_codebar.com/index.php?page=ACCUEIL" style="color: #F60;">Ancienne Interface</a></li> <li><a href="index.php?page=licence">Licence</a></li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> <img src="avatar/jolie.jpg" alt="" width="25" height="25">admin <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="#">Another action</a></li> <li><a href="index.php?page=update">Modifier mon Compte</a></li> <li><a href="index.php?page=change_magasin_2">Changer de magasin</a></li> <li role="separator" class="divider"></li> <li><a href="index.php?page=modiff_pass">Change mot de passe</a></li> <li><a href="index.php?page=fermer&ferm=1" style="color: #F60">Fermeture de caisse</a></li> <li><a href="index.php?page=logout" style="color: red"><i class="fa fa-sign-out pull-right"></i> Se Deconnecter</a></li> </ul> </li> </ul> </div><!-- /.navbar-collapse --> </div><!-- /.container-fluid --> </nav> <nav class="navbar navbar-default navbar-fixed-top" id="jntopsubnav"> <div class="container-fluid"> <ul class="nav navbar-nav"> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Recherche <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="index.php?page=compteClient">Recherche Compte client</a></li> <li><a href="index.php?page=search_0">Recherche Une créance</a></li> <li><a href="index.php?page=ble">Saisir Versement</a></li> <li><a href="index.php?page=Bilan_du_jour_caisse">Bilan du jour</a></li> <li><a href="index.php?page=Bilan_periode_caisse">Bilan par période</a></li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Saisie <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="index.php?page=NOUVEAU&clef=ad1AT4k9">Caisse</a></li> </ul> </li> <li class="dropdown"> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Fichier <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="index.php?page=ajout_cat_article">Ajouter un article</a></li> <li><a href="index.php?page=ajout_compt_fourn">Créer Compte fournisseur</a></li> <li><a href="index.php?page=ajout_compt_livreur">Créer Compte Livreur</a></li> <li><a href="index.php?page=enreg_ptit_caisse">Alimenter Petite Caisse</a></li> <li><a href="index.php?page=ajout_versement">Saisie Lieu Versement</a></li> <li><a href="index.php?page=ble">Saisie Versement</a></li> <li><a href="index.php?page=LesSortie">Saisie Sortie d'argent</a></li> <li><a href="index.php?page=ptitecaisse"> Sortie petite Caisse</a></li> <li><a href="index.php?page=articles_mank"> Saisir articles manquants</a></li> <li><a href="index.php?page=list_facture_0"> Enregistrer un client</a></li> <li><a href="index.php?page=depenser_0"> Effectuer une depense</a></li> <li><a href="index.php?page=bulletin_salaire_0"> Enregistrer salaire</a></li> <li><a href="index.php?page=enreg_pers"> Enregistrer personnel</a></li> </ul> </li> <li> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">États <span class="caret"></span></a> <ul class="dropdown-menu dropdown-menu-lg row"> <li class="col-sm-3"> <ul> <li class="dropdown-header">Fourniseur</li> <li><a href="index.php?page=list_fourn">Consulter</a></li> <li class="dropdown-header">LIvreur/Serveur</li> <li><a href="index.php?page=list_livreur">Consulter</a></li> <li class="dropdown-header">Bilan</li> <li><a href="index.php?page=EDITION">Afficher</a></li> </ul> </li> <li class="col-sm-3"> <ul> <li class="dropdown-header">Client</li> <li><a href="index.php?page=list_clients">Liste des client</a></li> <li><a href="index.php?page=situation_cl">Situation des Clients</a></li> <li><a href="index.php?page=list_clients_priv">Liste clients Prestiges</a></li> <li><a href="index.php?page=anniv">Anniversaire</a></li> <li><a href="index.php?page=prospections">Liste des prospections</a></li> <li class="dropdown-header">Produits</li> <li><a href="#">Liste des familles</a></li> <li><a href="#">Liste des sous-famille</a></li> <li><a href="index.php?page=printToutStockProduit">liste des produits</a></li> </ul> </li> <li class="col-sm-3"> <ul> <li class="dropdown-header">Livraison</li> <li><a href="index.php?page=list_livraisons">Liste des Livraisons</a></li> <li><a href="index.php?page=EDITION&liv=1">Recherche de Livraison</a></li> <li><a href="index.php?page=archiveliv">Livraisons Archivées</a></li> <li class="dropdown-header">En ligne</li> <li><a href="index.php?page=onlineCmd">Liste des commandes</a></li> <li><a href="index.php?page=onlineCmdArchive">Liste des commandes Archivées</a></li> </ul> </li> <li class="col-sm-3"> <ul> <li class="dropdown-header">Historique</li> <li><a href="index.php?page=historiques">Historique</a></li> <li><a href="index.php?page=fact_suppr">Historique Factures supprimées</a></li> </ul> </li> <li class="col-sm-3"> <ul> <li class="dropdown-header">Point de caisse</li> <li><a href="index.php?page=point_caisse">Afficher Point de caisse</a></li> <li class="dropdown-header">Sortie d'argent</li> <li><a href="index.php?page=aff_sorties">Sortie d'argent</a></li> </ul> </li> </ul> </li> <li class="dropdown dropdown-lg"> <a href="#" class="dropdown-toggle " data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Facturation <span class="caret"></span></a> <ul class="dropdown-menu"> <li class="dropdown-header">Bordereaux</li> <li><a onclick="popupCenter('print/printBorderau_0.php', 'myPop1',1500,600,5);" href="javascript:void(0);" >Gestion des Bordereaux</a></li> <li class="dropdown-header">Facturation</li> <li><a href="index.php?page=list_facture">Liste des factures</a></li> <li><a href="index.php?page=list_facture&id_reser=reserv">Liste Reservations</a></li> <li><a href="index.php?page=list_facture&id_prof=proforma">Liste Factures Pro-forma</a></li> <li class="dropdown-header">Compta</li> <li class="dropdown-header">Vente en Ligne</li> <li><a href="index.php?page=list_facture&id_online=online">Liste des produits en ligne</a></li> </ul> </li> <li> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Cuisine <span class="caret"></span></a> <ul class="dropdown-menu"> <li class="dropdown-header">Creez menu Cuisine</li> <li><a href="index.php?page=menucuisine">Entrée menu</a></li> <li><a href="index.php?page=bonusNombre">Entrez nombre de points</a></li> <li class="dropdown-header">Commandes</li> <li><a href="index.php?page=CAISSE_CUISINE">Commandes</a></li> <li><a href="index.php?page=CUISINE">Ecran Cuisine</a></li> </ul> </li> <li> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Stock <span class="caret"></span></a> <ul class="dropdown-menu"> <li class="dropdown-header">Entrée</li> <li><a href="index.php?page=STOCK">Approvisionnement</a></li> <li><a href="index.php?page=sttockCodeBar">Entrée en stock Code Bar</a></li> <li><a href="index.php?page=stock_status_peremption">Entrée Stock|Péremtion</a></li> <li class="dropdown-header">Articles</li> <li><a href="index.php?page=ajout_cat_article">Ajouter un article</a></li> <li><a href="index.php?page=edit_produit">Edition de produits</a></li> <li class="dropdown-header">Gestion des Seuil</li> <li><a href="index.php?page=harmonie_seuil">harmoniser</a></li> <li class="dropdown-header">Gestion Inventaire</li> <li><a href="print/printHistStockPlus.php">Historique de Stock</a></li> <li><a href="index.php?page=inventaire2">Inventaire</a></li> <li><a href="index.php?page=valeurstock">Valeur de Stock</a></li> <li><a href="index.php?page=invent_detail">Infos Inventaires</a></li> <li><a href="print/printHistStock.php">Historiques Inventaires</a></li> <li class="dropdown-header">Gestion Des Prosuits défaillants</li> <li><a href="index.php?page=articleDetruits">Afficher</a></li> </ul> </li> <li> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Configuration <span class="caret"></span></a> <ul class="dropdown-menu"> <li class="dropdown-header">Choix d'interface</li> <li><a href="index.php?page=interfaces">Entrer</a></li> <li class="dropdown-header">Config</li> <li><a href="index.php?page=setting">Entrer</a></li> <li class="dropdown-header">Config couleur</li> <li><a href="index.php?page=setting_font">Entrer</a></li> </ul> </li> <li> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Utilitaires <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="index.php?page=cree_entreprise">Créer un Entreprise</a></li> <li><a href="index.php?page=ajout_depot">Créer un Dépot</a></li> <li><a href="index.php?page=upl&t=logo">Charger Logo</a></li> <li><a href="index.php?page=nom_dg_fact">Créer nom DG</a></li> <li><a href="index.php?page=pied_de_page">Créer Bas de page Facture</a></li> <li><a href="index.php?page=haut_de_page">Créer Haut de page Facture</a></li> <li><a href="index.php?page=mt_prestige">Créer Montant Prèstige</a></li> <li><a href="index.php?page=ajout_priv">Créer Privilège</a></li> <li><a href="index.php?page=ajout_depense">Créer Dépenses</a></li> <li><a href="index.php?page=polices">Créer Police de texte</a></li> <li><a href="index.php?page=ajout_couleur">Créer Couleur</a></li> <li><a href="index.php?page=ajout_marque">Créer Marque</a></li> <li><a href="index.php?page=limit_remise">Limite Remise</a></li> </ul> </li> <li> <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Administration <span class="caret"></span></a> <ul class="dropdown-menu"> <li><a href="index.php?page=register">Créer un utilisateur</a></li> <li><a href="index.php?page=membre">Membres</a></li> </ul> </li> </ul> <form class="navbar-form navbar-right"> <div class="form-group"> <input type="text" class="form-control" placeholder="Search" id="searchtemp"> </div> <button type="submit" class="btn btn-default" style="display: none">Submit</button> </form> </div> </nav> <div class="container-fluid" style="padding-top: 101px; font-size:18px"> <div class="row"> <div class="col-md-12"> <link rel="stylesheet" href="css/style.css" /> <script type="text/javascript"> /* <![CDATA[ */ function mensualite() { k = document.forms['form'].elements['mtremi'].value; t = document.forms['form'].elements['total'].value; n = document.forms['form'].elements['monnai_remi'].value; r = document.forms['form'].elements['tot_remise'].value; if(r!=0){ j=k-n; m=j-r; m=Math.floor(m*100)/100; if(m>=0){ document.forms['form'].elements['avoir'].value = m; }else{ document.forms['form'].elements['avoir'].value = 0; } }else{ if(n!=''){ j=k-n; m=j-t; m=Math.floor(m*100)/100; if(m>=0){ document.forms['form'].elements['avoir'].value = m; }else{ document.forms['form'].elements['avoir'].value = 0; } } else { document.forms['form'].elements['avoir'].value = ''; } } } /* ]]> */ </script> <script type="text/javascript"> /* <![CDATA[ */ function mensualites() { k = document.forms['form'].elements['mtremi'].value; t = document.forms['form'].elements['total'].value; x = document.forms['form'].elements['monnai'].value; r = document.forms['form'].elements['tot_remise'].value; if(r!=''){ x=k-r; x=Math.floor(x*100)/100; document.forms['form'].elements['monnai'].value = x; }else if(t!='') { x=k-t; x=Math.floor(x*100)/100; document.forms['form'].elements['monnai'].value = x; } else { document.forms['form'].elements['monnai'].value = ''; } } /* ]]> */ </script> <!-- ********************************** ********************************** --><!-- ****************************************CALCUL DE POURCENTAGE********************************** --> <!-- ********************************** ********************************** --> <script type="text/javascript"> /* <![CDATA[ */ function mensualitees() { e = document.forms['form'].elements['total'].value; f = document.forms['form'].elements['remise'].value;//testresutat if(f!='') { g=e*f/100; z=e-g; h=Math.floor(z*100)/100; document.forms['form'].elements['tot_remise'].value = h; } else { document.forms['form'].elements['tot_remise'].value = ''; } } /* ]]> */ </script> <script language="javascript"> function ouvre_popup(page) { window.open(page,"nom_popup","menubar=no, status=no, scrollbars=yes, width=2480, height=3508"); } </SCRIPT> <script> function popupCenter(url, title, w, h, t) { var left = (screen.width/2)-(w/2); var top = (screen.height/2)-(h/2); return window.open(url, title, 'toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=no, resizable=no, copyhistory=no, width='+w+', height='+h+', top='+t+', left='+left); } </script> <style type="text/css"> #ligne_bleu{ display:none; } </style> <link href="css/cmdTabletteModal.css" rel="stylesheet"> <link href="css/cmdTabletteModalPourc.css" rel="stylesheet"> <form id="form" action="" method="post"> <table class="table" border="0"> <tr> <td width="255">CAISSIERE : admin</td> <td width="341"></td> <td> </td> <td width="300" colspan="3"> <form id="form1" name="form1" method="post" action=""> <div class="row"> <div class="col-md-1 mb-2"></div> <div class="col-md-7 mb-3"> <label for="firstName">ENTREZ CODE</label> <input type="text" name="code" class="form-control" id="firstName" placeholder="CODE ..." > <div class="invalid-feedback col-md-2"></div> </div> <div class="col-md-3 mb-3"> <label for="lastName"></label> <input style="padding-top: 5px" class="form-control btn btn-primary btn-lg btn-block" type="submit" name="submitcode" value="VALIDER LE CODE"> <div class="invalid-feedback"></div> </div> </div> </form></td> </tr> <tr> <td colspan="2" align="left"> <table id="tableau" width="100%" border="0"> <tr style="background-color:#CCC"> <td>#</td> <td>Designation</td> <td align="center">%</td> <td align="center">P.u</td> <td align="center">Qte</td> <td align="right">Total</td> <td> </td> </tr> <tr> <td colspan="7" style="color:#900; text-align:center; font-style:italic">AUCUNE VENTE POUR CE TICKET</td> </tr> </table> <div class="modal fade" id="squarespaceModal" tabindex="-1" role="dialog" aria-labelledby="modalLabel" aria-hidden="true"> <div class="modal-dialog"> <div class="modal-content"> <div class="modal-header"> <button type="button" class="close" data-dismiss="modal"><span aria-hidden="true">×</span><span class="sr-only">Close</span></button> <h3 class="modal-title" id="lineModalLabel">Réduction de cout</h3> </div> <div class="modal-body"> <!-- content goes here --> <style type="text/css"> /* Basic reset */ * { margin: 0; padding: 0; box-sizing: border-box; /* Better text styling */ font: bold 14px Arial, sans-serif; } /* Finally adding some IE9 fallbacks for gradients to finish things up */ /* A nice BG gradient */ html { height: 100%; background: white; background: radial-gradient(circle, #fff 20%, #ccc); background-size: cover; } /* Using box shadows to create 3D effects */ #calculator { width: 325px; height: auto; margin: 100px auto; padding: 20px 20px 9px; background: #9dd2ea; background: linear-gradient(#9dd2ea, #8bceec); border-radius: 3px; box-shadow: 0px 4px #009de4, 0px 10px 15px rgba(0, 0, 0, 0.2); } /* Top portion */ .top span.clear { float: left; } /* Inset shadow on the screen to create indent */ .top .screen { height: 40px; width: 212px; float: right; padding: 0 10px; background: rgba(0, 0, 0, 0.2); border-radius: 3px; box-shadow: inset 0px 4px rgba(0, 0, 0, 0.2); /* Typography */ font-size: 17px; line-height: 40px; color: white; text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.2); text-align: right; letter-spacing: 1px; } /* Clear floats */ .keys, .top {overflow: hidden;} /* Applying same to the keys */ .keys span, .top span.clear { float: left; position: relative; top: 0; cursor: pointer; width: 66px; height: 36px; background: white; border-radius: 3px; box-shadow: 0px 4px rgba(0, 0, 0, 0.2); margin: 0 7px 11px 0; color: #888; line-height: 36px; text-align: center; /* prevent selection of text inside keys */ user-select: none; /* Smoothing out hover and active states using css3 transitions */ transition: all 0.2s ease; } /* Remove right margins from operator keys */ /* style different type of keys (operators/evaluate/clear) differently */ .keys span.operator { background: #FFF0F5; margin-right: 0; } .keys span.eval { background: #f1ff92; box-shadow: 0px 4px #9da853; color: #888e5f; } .top span.clear { background: #ff9fa8; box-shadow: 0px 4px #ff7c87; color: white; } /* Some hover effects */ .keys span:hover { background: #9c89f6; box-shadow: 0px 4px #6b54d3; color: white; } .keys span.eval:hover { background: #abb850; box-shadow: 0px 4px #717a33; color: #ffffff; } .top span.clear:hover { background: #f68991; box-shadow: 0px 4px #d3545d; color: white; } /* Simulating "pressed" effect on active state of the keys by removing the box-shadow and moving the keys down a bit */ .keys span:active { box-shadow: 0px 0px #6b54d3; top: 4px; } .keys span.eval:active { box-shadow: 0px 0px #717a33; top: 4px; } .top span.clear:active { top: 4px; box-shadow: 0px 0px #d3545d; } </style> <div id="calculator"> <!-- Screen and clear key --> <div class="top"> <span class="clear">C</span> <div class="screen"> <input type="text" name="qte" id="inpresult" value="" style="font-size: 36px; text-align: left; color: red; font-weight: bold;" > </div> </div> <div class="keys"> <!-- operators and other keys --> <span>7</span> <span>8</span> <span>9</span> <span>4</span> <span>5</span> <span>6</span> <span>1</span> <span>2</span> <span>3</span> <span>0</span> </div> <hr class="mb-4"> <div class="row"> <div class="col-md-3"></div> <div class="col-md-6"> <input onclick="inserer2()" type="button" name="valider" class="btn btn-success btn-block flatbtn" value="Appliquez un pourcentage"> </div> <div class="col-md-3"></div> </div> </div> <script type="text/javascript"> // Get all the keys from document var keys = document.querySelectorAll('#calculator span'); var operators = ['+', '-', 'x', '÷']; var decimalAdded = false; // Add onclick event to all the keys and perform operations for(var i = 0; i < keys.length; i++) { keys[i].onclick = function(e) { // Get the input and button values var input = document.getElementById("inpresult"); var inputVal = input.value; var btnVal = this.innerHTML // Now, just append the key values (btnValue) to the input string and finally use javascript's eval function to get the result // If clear key is pressed, erase everything if(btnVal == 'C') { input.value = ''; decimalAdded = false; } // If eval key is pressed, calculate and display the result else if(btnVal == '=') { var equation = inputVal; var lastChar = equation[equation.length - 1]; // Replace all instances of x and ÷ with * and / respectively. This can be done easily using regex and the 'g' tag which will replace all instances of the matched character/substring equation = equation.replace(/x/g, '*').replace(/÷/g, '/'); // Final thing left to do is checking the last character of the equation. If it's an operator or a decimal, remove it if(operators.indexOf(lastChar) > -1 || lastChar == '.') equation = equation.replace(/.$/, ''); if(equation) input.value = eval(equation); decimalAdded = false; } // Basic functionality of the calculator is complete. But there are some problems like // 1. No two operators should be added consecutively. // 2. The equation shouldn't start from an operator except minus // 3. not more than 1 decimal should be there in a number // We'll fix these issues using some simple checks // indexOf works only in IE9+ else if(operators.indexOf(btnVal) > -1) { // Operator is clicked // Get the last character from the equation var lastChar = inputVal[inputVal.length - 1]; // Only add operator if input is not empty and there is no operator at the last if(inputVal != '' && operators.indexOf(lastChar) == -1) input.value += btnVal; // Allow minus if the string is empty else if(inputVal == '' && btnVal == '-') input.value += btnVal; // Replace the last operator (if exists) with the newly pressed operator if(operators.indexOf(lastChar) > -1 && inputVal.length > 1) { // Here, '.' matches any character while $ denotes the end of string, so anything (will be an operator in this case) at the end of string will get replaced by new operator input.value = inputVal.replace(/.$/, btnVal); } decimalAdded =false; } // Now only the decimal problem is left. We can solve it easily using a flag 'decimalAdded' which we'll set once the decimal is added and prevent more decimals to be added once it's set. It will be reset when an operator, eval or clear key is pressed.input.innerHTML else if(btnVal == '.') { if(!decimalAdded) { input.value += btnVal; decimalAdded = true; } } // if any other key is pressed, just append it else { input.value += btnVal; } // prevent page jumps e.preventDefault(); } } </script> </div> <div class="modal-footer"> <div class="btn-group btn-group-justified" role="group" aria-label="group button"> <div class="btn-group" role="group"> <button type="button" class="btn btn-default" data-dismiss="modal" role="button">Close</button> </div> <div class="btn-group btn-delete hidden" role="group"> <button type="button" id="delImage" class="btn btn-default btn-hover-red" data-dismiss="modal" role="button">Delete</button> </div> <div class="btn-group" role="group"> <button type="button" id="saveImage" class="btn btn-default btn-hover-green" data-action="save" role="button"></button> </div> </div> </div> </div> </div> </div> <div class="modal fade" id="login-modal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;"> <div class="modal-dialog"> <div class="loginmodal-container"> <form > <div class="row"> <div class="col-md-3"></div> <div class="col-md-6"> <label for="firstName"></label> <div class="invalid-feedback"></div> </div> <div class="col-md-3"></div> </div> <br> <div class="calculator"> <div class="output"> <div id="calculation"> <!-- Display for calculation --> </div> <div id="input"> <!-- Display for Input & Result --> <input type="text" name="qte" id="inpresult" value="" style="font-size: 36px; text-align: center; color: red; font-weight: bold;" > <input id="cache" hidden type="text" name="id" value=""> <input id="clef" hidden type="text" name="clef" value="a0AzT2U8"> </div> </div> <div class="button-field"> <button type="button" id="c" class="clear" name="clear"><span>c</span></button> <button type="button" id="ce" class="clear" name="clear-entry"><span>ce</span></button> <button type="button" id="0" class="number" name="0">0</button> <button type="button" id="7" class="number" name="7">7</button> <button type="button" id="8" class="number" name="8">8</button> <button type="button" id="9" class="number" name="9">9</button> <button type="button" id="4" class="number" name="4">4</button> <button type="button" id="5" class="number" name="5">5</button> <button type="button" id="6" class="number" name="6">6</button> <button type="button" id="1" class="number" name="1">1</button> <button type="button" id="2" class="number" name="2">2</button> <button type="button" id="3" class="number" name="3">3</button> </div> </div> <hr class="mb-4"> <div class="row"> <div class="col-md-3"></div> <div class="col-md-6"> <input onclick="inserer()" type="button" name="valider" class="btn btn-success btn-block flatbtn" value="Modiffier"> </div> <div class="col-md-3"></div> </div> </form> <script type="text/javascript"> $(document).ready(function(){ const buttons = document.querySelectorAll("button"); const currCalc = document.querySelector("#calculation"); const currInput = document.getElementById("inpresult"); const checkRE = /(\d|\))$/; // RegExp matches, if last character of string is number or ')' const re1 = /(0+)$/g; // RegExp matches all 0 at the en of a string const re2 = /\.$/; // RegExp matches dot at the end let calc = []; let input = []; let res; let intRes = false; let disCalc = []; let disResult; let str; function onNumber(el) { // print number, unless user tries to input multiple zeros in the beginning & input-display is full if ( ((el === "0" && (input[0] !== "0" || input.includes("."))) || el !== "0") && input.length < 20 ) { input[0] === "0" && !input.includes(".") && el !== "0" ? (input = []) : input; input.push(el); currInput.value = `${input.join("")}`; } } function onClear(el) { if (el === "c") { // clear all calc = []; input = []; intRes = false; res = undefined; displayCalculation(calc, false); currInput.value = ""; // console.log(calc, input, negative, intRes, res); } else if (el === "ce") { // clear entry (input) input = []; currInput.value = ""; } else if (el === "del" && input.length > 0) { // delete last input character input.splice(-1); currInput.value = `${input.join("")}`; } } function onNeg() { // toggle between ± only if input is not 0 if (input.length !== 0 && eval(input.join("")) !== 0) { let negative; input[0] === "-" ? (negative = true) : (negative = false); // if-condition for display-reasons if ((!negative && input.length < 20) || negative) { negative ? input.shift() : input.unshift("-"); currInput.value = `${input.join("")}`; } } } function onDot() { // print dot, unless input is already a decimal & condition for display-reasons if (!input.includes(".") && input.length < 20) { input.length > 0 ? input.push(".") : input.push("0", "."); currInput.value = `${input.join("")}`; } } function onOperator(operator) { // eliminate redundant 0 from input end(re1), and dot if necessary(re2) input.join("").includes(".") && re1.test(input.join("")) ? (input = input .join("") .replace(re1, "") .replace(re2, "") .split("")) : input; // run only, if input ends with checkRE OR // calc isn't empty and ends with checkRE => || (calc.length > 0 && checkRE.test(calc)) if (checkRE.test(input)) { // input in calc, dependend if input is negative or not ; then reset input eval(input.join("")) < 0 ? calc.push(`(${input.join("")})`) : calc.push(`${input.join("")}`); input = []; // operator in calc calc.push(operator); // display current input and calc displayCalculation(calc, false); currInput.value = `${input.join("")}`; } } function onEqual() { // eliminate redundant 0 from input end(re1), and dot if necessary(re2) input.join("").includes(".") && re1.test(input.join("")) ? input = input .join("") .replace(re1, "") .replace(re2, "") .split("") : input; // run only if input ends with checkRE if (checkRE.test(input)) { // input in calc, dependend if input is negative or not ; then reset input eval(input.join("")) < 0 ? calc.push(`(${input.join("")})`) : calc.push(`${input.join("")}`); input = []; // resolve calculation, only if calc ends with checkRE if (checkRE.test(calc)) { res = eval(calc.join("")); // display calculation and result displayCalculation(calc, true); displayResult(res); } } } function followUp(withIntRes) { if (withIntRes) { input = res.toString().split(""); } calc = []; res = undefined; intRes = undefined; currCalc.innerHTML = `${calc}`; } function displayResult(res) { if (res > 99999999999999999999 || res < -9999999999999999999) { disResult = "error"; calc = []; input = []; res = []; intRes = false; displayCalculation([], false); } else { disResult = res; intRes = true; } currInput.value = `${disResult}`; } function displayCalculation(calcArr, final) { final ? calcArr.push("=") : calcArr; str = calcArr.join(""); if (str.length > 30) { str = str.substr(-29); disCalc = `…${str}`; } else { disCalc = str; } currCalc.innerHTML = disCalc; } function calculator() { if (this.className === "number") { if (intRes) { followUp(false); } onNumber(this.id); } else if (this.className === "clear") { onClear(this.id); } else if (this.id === "negative") { if (intRes) { followUp(true); } onNeg(); } else if (this.className === "dot") { if (intRes) { followUp(false); } onDot(); } else if (this.className === "operator") { if (intRes) { followUp(true); } onOperator(this.id); } else if (this.className === "equal") { onEqual(); } } buttons.forEach(button => button.addEventListener("click", calculator)); }); </script> </div> </div> </div> </td> <td colspan="4" align="right"><table width="760" border="0" style="font-weight:bold"> <tr> <td width="212" style=" color:#000">MONTANT TOTAL A PAYER </td> <td bgcolor="#CCCCCC" width="227"><input type="text" name="total" id="total" value = "" style="background-color:#03C;font-size:40px; font-weight:bold; width:200px; color:white; text-align:right"/> F</td> <td bgcolor="#CCCCCC" width="108"><a href="#" style="text-decoration:none; color:#DD4800">Remise T</a></td> </tr> <tr> <td style=" color:#000">% REMISE </td> <td bgcolor="#CCCCCC"><input type="text" name="remise" id="remise" style="background-color:#FFF;font-size:36px; font-weight:bold; width:200px; color:red;text-align:right" onkeyup="mensualitees();" /></td> <td bgcolor="#CCCCCC"> </td> </tr> <tr> <td style=" color:#000">TOTAL APRES REMISE</td> <td bgcolor="#CCCCCC"><input type="text" name="tot_remise" id="tot_remise" value = "" style="background-color:#F90;font-size:36px; width:200px;text-align:right; color:white "/> F</td> <td bgcolor="#CCCCCC"> </td> </tr> <tr> <td width="212" style=" color:#000">MONTANT RECU </td> <td colspan="2" bgcolor="#CCCCCC"><input type="text" name="mtremi" id="mtremi" style="background-color:#300;font-size:36px; color:white; font-weight:bold; width:200px;text-align:right" onkeyup="mensualites();" /> F</td> </tr> <tr> <td style=" color:#000">MONNAIE</td> <td colspan="2" bgcolor="#CCCCCC"><input type="text" name="monnai" id="monnai" style="background-color:#9F3;font-size:36px; font-weight:bold; width:200px;text-align:right" /> F</td> </tr> <tr> <td width="212" style=" color:#000">MONNAIE RENDUE <span style="font-size:10px; color:red"></span></td> <td colspan="2" bgcolor="#CCCCCC"><input type="text" name="monnai_remi" id="monnai_remi" onkeyup="mensualite();" style="background-color:#FFF;font-size:36px; font-weight:bold; width:200px;text-align:right"/> F</td> </tr> <tr> <td width="212" style=" color:#000">AVOIR</td> <td colspan="2" bgcolor="#CCCCCC"><input type="text" name="avoir" id="avoir" style="background-color:#FFF;font-size:36px; font-weight:bold; width:200px;text-align:right" /> F</td> </tr> <tr> <td style=" color:#400000">DATE</td> <td colspan="2" bgcolor="#CCCCCC"><input type="text" name="date_vente" id="date_vente" style="background-color:#FFF;font-size:16px; font-weight:bold; width:200px; text-align:center" value="30/01/2019" /></td> </tr> <tr> <td style=" color:#400000"> </td> <td colspan="2" bgcolor="#CCCCCC"><table width="514" border="0"> <tr> <td width="33"><input type="checkbox" name="compte" id="compte" value="1" /></td> <td width="173" style="font-size:16px; font-weight:bold;">Deduire de mon Compte</td> <td width="29"><a onclick="popupCenter('index.php?page=aideCompte', 'myPop1',960,600,10);" href="javascript:void(0);"><img src="images/aide.png" width="15" height="15" /></a></td> <td width="29"><input type="checkbox" name="monavoir" id="monavoir" value="1" /></td> <td width="183" style="font-size:16px; font-weight:bold;">Ajouter Avoir a mon compte</td> </tr> </table></td> </tr> <tr> <td style=" color:#400000"> </td> <td colspan="2" bgcolor="#CCCCCC"><table width="513" border="0"> <tr> <td width="24"><input type="checkbox" name="proforma" id="proforma" value="1" /></td> <td width="136" style="font-size:16px; font-weight:bold;">Facture proforma ?</td> <td width="28"><input type="checkbox" name="reservation" id="reservation" value="1" /></td> <td width="95" style="font-size:16px; font-weight:bold;">Reservation</td> <td width="208" style="font-size:16px; font-weight:bold;"> </td> </tr> </table></td> </tr> <tr> <td style=" color:#400000"> </td> <td colspan="2" bgcolor="#CCCCCC"><table width="517" border="0"> <tr> <td width="20"><input type="checkbox" name="livraison" id="livraison" value="1" /></td> <td width="175">Destiné à être Livré ?</td> <td width="30"><input type="checkbox" name="livComptant" id="livComptant" value="0" /></td> <td width="102">Payé comptant</td> <td width="25"><input type="checkbox" name="livComptant" id="livComptant" value="1" /></td> <td width="139">Payé à la Livraison</td> </tr> </table></td> </tr> <tr> <td style=" color:#400000"> </td> <td colspan="2" bgcolor="#CCCCCC"><table width="369" border="0" style="color:#F60;margin-left:15px;"> <tr style="background-color:#FFD7FF; color:#000; font-weight:bold; text-align:right"> <td width="117">Espece</td> <td width="38" style="text-align:center"><input type="radio" name="cb" id="checkbox" value="esp" checked/> <label for="checkbox"></label></td> <td width="76">Chèque</td> <td width="34" style="text-align:center"><input type="radio" name="cb" id="checkbox2" value="ck"/></td> <td width="38">CB</td> <td width="40" style="text-align:center"><input type="radio" name="cb" id="checkbox3" value="cb"/></td> </tr> </table></td> </tr> <tr> <td style=" color:#400000"> </td> <td colspan="2" bgcolor="#CCCCCC"><table width="200" border="0"> <tr> <td><input type="submit" name="submit" value="EMETTRE TICKET" style="background-color:#002800;color:#FFF" /></td> <td><input type="submit" name="submit2" value="EMETTRE FACTURE" style="background-color:#002800;color:#FFF" /></td> <td><a href="index.php?page=annuler_vente&num="><img src="images/boutonAnnuler.png" alt="f" width="110" height="28" /></a></td> </tr> </table></td> </tr> </table></td> </tr> </table> <table width="200" border="0" style="color: #400000"> <tr> <td> </td> </tr> </table> </form> <script type="text/javascript" src="js/placerModal.js"></script> <script type="text/javascript" src="js/ajaxModal.js"></script> <script type="text/javascript" src="js/placerModalPourcentage.js"></script> <script type="text/javascript" src="js/ajaxModalPourcentage.js"></script> </div> </div> </div> <script src="js/js.js" ></script>- Messages postés
-
35409
- Date d'inscription
- mercredi 22 octobre 2003
- Statut
- Modérateur
- Dernière intervention
- 16 mai 2022
35630 janv. 2019 à 23:40
es tu sûr que le chemin que tu as indiqué est le bon ? à savoir :
Si tu mets en commentaire cette ligne et que tu réutilise celle d'avant (qui est en commentaire quelques lignes plus haut, pointant sur le cdn jquery )
qu'est-ce que ça donne ?
Ah.. et il nous faudrait aussi le code du fichier
placerModalPourcentage.js
- Messages postés
-
500
- Date d'inscription
- lundi 24 août 2009
- Statut
- Membre
- Dernière intervention
- 13 avril 2021
130 janv. 2019 à 23:58
, les modals fonctionnent plus, les liens fonctionnent plus.
voici placerModalPourcentage.js
let qteInput = document.getElementById('inpresult') ; let idInput = document.getElementById('cache') ; //const links = document.getElementById('tableau').getElementsByTagName('a') ; function placer(arg){ qteInput.setAttribute('value',arg.textContent) ; idInput.setAttribute('value',arg.id) ; }la console affiche