Архивы javascript - Страница 7 из 11

Простая загрузка файла на сервер используя JQUERY

18.12.2018 Павел Грибов PHP, WEB

Задача: сохранить файл на сервер без обновления страницы. Т.е. при помощи ajax

Решение:

Клиентская часть:

<h1>Отправка сообщения в техподдержку</h1>
    <div id="snd">
        <form id="data" method="post" enctype="multipart/form-data">
            <textarea id="tehtxt" name="tehtxt" class="form-control" rows="3" placeholder="Сообщение для техподдержки"></textarea>
            <br/>
            <input name="image" type="file" />
            <br/>
            <button class="btn btn-success" id="buttonsendteh">Отправить сообщение</button>
        </form>
    </div>
    <br/>
    <script>
        $("form#data").submit(function(e) {
                e.preventDefault();    
                var formData = new FormData(this);
                $("#buttonsendteh").hide();
                $.ajax({
                    url: "index.php?route=/controller/server/sendtoteh.php",
                    type: 'POST',                  
                    data: formData,
                    success: function (data) {
			$("#snd").html(data);    
			ListSbssMessages();
			$("#buttonsendteh").show();
                    },
                    cache: false,
                    contentType: false,
                    processData: false
                });
        });
    </script>

<h1>Отправка сообщения в техподдержку</h1>

<br/>

<br/>

<button class="btn btn-success" id="buttonsendteh">Отправить сообщение</button>

</form>

</div>

<br/>

$("form#data").submit(function(e) {

e.preventDefault();

var formData = new FormData(this);

$("#buttonsendteh").hide();

$.ajax({

url: "index.php?route=/controller/server/sendtoteh.php",

type: 'POST',

data: formData,

success: function (data) {

$("#snd").html(data);

ListSbssMessages();

$("#buttonsendteh").show();

cache: false,

contentType: false,

processData: false

});

</script>

Серверная часть:

 $tehtxt=mysqli_real_escape_string($sqlcn->idsqlconnection,$_POST["tehtxt"]);
 $prc="";  
  if (isset($_FILES['image'])==true){
    $orig_file = $_FILES['image']['name']; 
    $userfile_name = GetRandomId(8) . '.' . pathinfo($orig_file, PATHINFO_EXTENSION);
    $src = $_FILES['image']['tmp_name'];    
    $res = move_uploaded_file($src, WUO_ROOT."/files/".$userfile_name);     
    $prc="Прикрепленный файл: $userfile_name";
  };

$tehtxt=mysqli_real_escape_string($sqlcn->idsqlconnection,$_POST["tehtxt"]);

$prc="";

if (isset($_FILES['image'])==true){

$orig_file = $_FILES['image']['name'];

$userfile_name = GetRandomId(8) . '.' . pathinfo($orig_file, PATHINFO_EXTENSION);

$src = $_FILES['image']['tmp_name'];

$res = move_uploaded_file($src, WUO_ROOT."/files/".$userfile_name);

$prc="Прикрепленный файл: $userfile_name";

};

Оставить комментарий form, javascript, Jquery, загрузка файла

Пример печати чека на ККМ Атол посредством JavaScript

20.06.2018 Павел Грибов Без рубрики

Накопал на просторах интернета.. Выложил, чтоб подсматривать саму методику работы. Принцип на любом языке одинаковый.

» Читать далее

6 комментариев javascript, атол, ккм, онлайн касса, печать чека

Jquery и маска ввода телефона

12.02.2018 Павел Грибов WEB

К сожалению наиболее часто упоминаемый в «интернетах» плагин maskedinput не очень хорошо работает на мобильных устройствах. Адекватной заменой может служить плагин inputmask: https://github.com/RobinHerbots/Inputmask

Один огромный минус — уж очень «жирноват» плагин для простых задачь. Иногда лучше использовать «чистый» javascript:

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
</head>

<body>
    <input  value="+7(___)___-____">
    <script>
window.addEventListener("DOMContentLoaded", function() {
function setCursorPosition(pos, elem) {
    elem.focus();
    if (elem.setSelectionRange) elem.setSelectionRange(pos, pos);
    else if (elem.createTextRange) {
        var range = elem.createTextRange();
        range.collapse(true);
        range.moveEnd("character", pos);
        range.moveStart("character", pos);
        range.select()
    }
}

function mask(event) {
    var matrix = this.defaultValue,
        i = 0,
        def = matrix.replace(/\D/g, ""),
        val = this.value.replace(/\D/g, "");
        def.length >= val.length && (val = def);
    matrix = matrix.replace(/[_\d]/g, function(a) {
        return val.charAt(i++) || "_"
    });
    this.value = matrix;
    i = matrix.lastIndexOf(val.substr(-1));
    i < matrix.length && matrix != this.defaultValue ? i++ : i = matrix.indexOf("_");
    setCursorPosition(i, this)
}

    var input = document.querySelector("input");
    input.addEventListener("input", mask, false)
});
  </script>
</body>

</html>

<!DOCTYPE HTML>

<html>

<head>

<title>Untitled</title>

</head>

<body>

window.addEventListener("DOMContentLoaded", function() {

function setCursorPosition(pos, elem) {

elem.focus();

if (elem.setSelectionRange) elem.setSelectionRange(pos, pos);

else if (elem.createTextRange) {

var range = elem.createTextRange();

range.collapse(true);

range.moveEnd("character", pos);

range.moveStart("character", pos);

range.select()

}

function mask(event) {

var matrix = this.defaultValue,

i = 0,

def = matrix.replace(/\D/g, ""),

val = this.value.replace(/\D/g, "");

def.length >= val.length && (val = def);

matrix = matrix.replace(/[_\d]/g, function(a) {

return val.charAt(i++) || "_"

});

this.value = matrix;

i = matrix.lastIndexOf(val.substr(-1));

i < matrix.length && matrix != this.defaultValue ? i++ : i = matrix.indexOf("_");

setCursorPosition(i, this)

}

var input = document.querySelector("input");

input.addEventListener("input", mask, false)

});

</script>

</body>

</html>

Оставить комментарий inputmask, javascript, maskedinput, maskinput, мобильный

Простой способ сохранить файл по нажатию кнопки на странице (HTML)

08.02.2018 Павел Грибов PHP

Задача: по нажатию кнопки на странице, чтоб вызывался диалог сохранения файла и собственно сохранялся произвольный файл с сервера.

Решение:

В коде html страницы упоминаем скрытую форму:

<form method="post" action="inc/csvExport.php">
	<input type="hidden" name="csvBuffer" id="csvBuffer" value="" />
</form>

</form>

Добавляем туда же обработчик нажатия вида:

    $("#viewwork").click(function(){       
            document.forms[0].method='POST';
            document.forms[0].action=save_file.php; 
            document.forms[0].target='_self';
            document.forms[0].submit();  	    	    
       return false;
    });

$("#viewwork").click(function(){

document.forms[0].method='POST';

document.forms[0].action=save_file.php;

document.forms[0].target='_self';

document.forms[0].submit();

return false;

});

Ну код на сервере для:

save_file.php:

<?php

// Данный код создан и распространяется по лицензии GPL v3
// Изначальный автор данного кода - Грибов Павел
// http://грибовы.рф

$ex= "1;2;3;4;5;6;7";
 header("Content-type: application/msexcel");
    header("Accept-Ranges: bytes");
    header("Content-Length: " . strlen($ex));
    header("Content-Disposition: attachment; filename=rep_by_addr.csv");

?>

<?php

// Данный код создан и распространяется по лицензии GPL v3

// Изначальный автор данного кода - Грибов Павел

// http://грибовы.рф

$ex= "1;2;3;4;5;6;7";

header("Content-type: application/msexcel");

header("Accept-Ranges: bytes");

header("Content-Length: " . strlen($ex));

header("Content-Disposition: attachment; filename=rep_by_addr.csv");

csvExport.php:

<?php

// Данный код создан и распространяется по лицензии GPL v3
// Изначальный автор данного кода - Грибов Павел
// http://грибовы.рф

header('Content-type: application/vnd.ms-excel');
if (isset($_GET["csv"])==true){
    header("Content-Disposition: attachment; filename=file.csv");
} else {
    header("Content-Disposition: attachment; filename=file.xls");
};
header("Pragma: no-cache");

$buffer = $_POST['csvBuffer'];

try{
    echo $buffer;
}catch(Exception $e){

}
?>

<?php

// Данный код создан и распространяется по лицензии GPL v3

// Изначальный автор данного кода - Грибов Павел

// http://грибовы.рф

header('Content-type: application/vnd.ms-excel');

if (isset($_GET["csv"])==true){

header("Content-Disposition: attachment; filename=file.csv");

} else {

header("Content-Disposition: attachment; filename=file.xls");

};

header("Pragma: no-cache");

$buffer = $_POST['csvBuffer'];

try{

echo $buffer;

}catch(Exception $e){

}

Оставить комментарий html, javascript, php, сохранение файла

Установка курсора в позицию поля input или textarea на JavaScript

12.12.2017 Павел Грибов WEB

Кроссплатформенное решение, не требующее Jquery:

function getCaretPosition(ctrl) {
    if (document.selection) {
        ctrl.focus();
        var range = document.selection.createRange();
        var rangelen = range.text.length;
        range.moveStart('character', -ctrl.value.length);
        var start = range.text.length - rangelen;
        return {
            'start': start,
            'end': start + rangelen
        };
    } else if (ctrl.selectionStart || ctrl.selectionStart == '0') {
        return {
            'start': ctrl.selectionStart,
            'end': ctrl.selectionEnd
        };
    } else {
        return {
            'start': 0,
            'end': 0
        };
    }
}


function setCaretPosition(ctrl, start, end) {
    if (ctrl.setSelectionRange) {
        ctrl.focus();
        ctrl.setSelectionRange(start, end);
    } else if (ctrl.createTextRange) {
        var range = ctrl.createTextRange();
        range.collapse(true);
        range.moveEnd('character', end);
        range.moveStart('character', start);
        range.select();
    }
};

function getCaretPosition(ctrl) {

if (document.selection) {

ctrl.focus();

var range = document.selection.createRange();

var rangelen = range.text.length;

range.moveStart('character', -ctrl.value.length);

var start = range.text.length - rangelen;

return {

'start': start,

'end': start + rangelen

};

} else if (ctrl.selectionStart || ctrl.selectionStart == '0') {

return {

'start': ctrl.selectionStart,

'end': ctrl.selectionEnd

};

} else {

return {

'start': 0,

'end': 0

};

}

function setCaretPosition(ctrl, start, end) {

if (ctrl.setSelectionRange) {

ctrl.focus();

ctrl.setSelectionRange(start, end);

} else if (ctrl.createTextRange) {

var range = ctrl.createTextRange();

range.collapse(true);

range.moveEnd('character', end);

range.moveStart('character', start);

range.select();

}

};

Использование:

//прочитаем позицию с выделеним
outpz = getCaretPosition(document.getElementById('summpayme'));
//установим позицию с выделением
setCaretPosition(document.getElementById('summpayme'),outpz.start, outpz.end);

//прочитаем позицию с выделеним

outpz = getCaretPosition(document.getElementById('summpayme'));

//установим позицию с выделением

setCaretPosition(document.getElementById('summpayme'),outpz.start, outpz.end);

Оставить комментарий input, javascript, textarea, позиция курсора, установить

« 1 … 5 6 7 8 9 … 11 »

Пн	Вт	Ср	Чт	Пт	Сб	Вс
	1	2	3	4	5	6
7	8	9	10	11	12	13
14	15	16	17	18	19	20
21	22	23	24	25	26	27
28	29	30	31