Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 04.02.2014, 14:42
Аспирант
Отправить личное сообщение для DeUM Посмотреть профиль Найти все сообщения от DeUM
 
Регистрация: 27.02.2013
Сообщений: 36

плагин для отправки данных
добрый день,
создаю небольшой плагин, смысл которого собрать и отправить данные через ajax:
$.fn.divForm = function($data) {
        $post = $dataname = null;
        form = this; action = this.attr('data-action'); method = this.attr('data-method'); textarea = this.find('.form-textarea');
        $('div.form-textarea:first').attr('id', 'form-action');
        this.on('click', 'div.form-textarea', function() {
            $('div.form-textarea').attr('id', '');
            $(this).attr('id', 'form-action');
            return false;
        })
        this.on('click', 'button', function() {
            if($(this).attr('data-fi') == 'simple') {
                insBB('['+$(this).val()+']', '[/'+$(this).val()+']', 'form-action')
            }
            if($(this).attr('data-fi') == 'href') {
                $href = prompt('Укажите ссылку', 'http://');
                insBB('[href='+$href+']Ссылка', '[/href]', 'form-action');
            }
            return false;
        })
        this.on('change', 'input[type="color"]', function() {
            if($(this).attr('data-fi') == 'simple') {
                insBB('[color='+$(this).val()+']', '[/color]', 'form-action');
                return false;
            }
        })
        this.on('change', 'select', function() {
            if($(this).attr('data-fi') == 'simple') {
                insBB('[size='+$(this).val()+']', '[/size]', 'form-action');
                return false;
            }
        })
        this.on('click', 'input[type="submit"]', function() {
            if(textarea.text() != '') {
                $dataname = form.find('[data-name]');
                if($dataname.html().match(/&/)) {
                    $post = $dataname.attr('data-name') + '=' + encodeURIComponent($dataname.html());
                }
                else $post = $dataname.attr('data-name') + '=' + $dataname.html();
                form.find('[data-name]').each(function(e) {
                    if(e != 0) {
                        if($dataname.html().match(/&/)) {
                            $post += '&'+$(this).attr('data-name')+'='+encodeURIComponent($(this).html());
                        }
                        else $post += '&'+$(this).attr('data-name')+'='+$(this).html();
                    }
                })
                $.ajax({
                    url: action,
                    method: method,
                    data: $post+$data,
                    success: function(html) {
                        ialert(html);
                    }
                })
            }
            else ialert('<error>Незаполнено сообщение!</error>');
        })
    }

Работает так:
$('.form').divForm('topic=4'); //как $data; &topic=4
Преобразить в такой вид:
$('.form').divForm({
'topic': 4
});

Да и
;ialert() //popup window

<div class="form f-form-new-post" data-action="$action" data-method="post">
    <div class="form-bb">
        <button value="b" style="font-weight: bold" data-fi="simple">b</button>
        <button value="i" style="font-style: italic" data-fi="simple">i</button>
        <button value="u" style="text-decoration:underline" data-fi="simple">u</button>
        <button value="img" data-fi="simple">img</button>
        <button value="href" data-fi="href">Ссылка</button>
        <button value="quote" data-fi="simple">Цитата</button>
        <button value="left" data-fi="simple">Лево</button>
        <button value="center" data-fi="simple">Центр</button>
        <button value="right" data-fi="simple">Право</button>
        <button value="spoiler" data-fi="simple">Спойлер</button>

        <input type="color" data-fi="simple" title="Цвет">
        <select data-fi="simple">
            <option>Размер</option>
            <option value="6">6px</option>
            <option value="8">8px</option>
            <option value="10">10px</option>
            <option value="12">12px</option>
            <option value="14">14px</option>
            <option value="16">16px</option>
            <option value="18">18px</option>
        </select>
    </div>
    <div class="form-border-textarea"><div class="form-textarea" contenteditable="true" tabindex="0" data-name="message"></div></div>
    <div class="form-include"></div>
    <input type="submit" value="Отправить" class="form-submit">
</div>

Последний раз редактировалось DeUM, 04.02.2014 в 16:25. Причина: animhotep
Ответить с цитированием
  #2 (permalink)  
Старый 04.02.2014, 15:46
Аватар для animhotep
Профессор
Отправить личное сообщение для animhotep Посмотреть профиль Найти все сообщения от animhotep
 
Регистрация: 17.01.2013
Сообщений: 887

удачи, чё
выложите пример с html, чтоб был понятней смысл плагина
Ответить с цитированием
  #3 (permalink)  
Старый 04.02.2014, 18:02
Аспирант
Отправить личное сообщение для DeUM Посмотреть профиль Найти все сообщения от DeUM
 
Регистрация: 27.02.2013
Сообщений: 36

Изменил
Ответить с цитированием
  #4 (permalink)  
Старый 05.02.2014, 12:08
Профессор
Отправить личное сообщение для kostyanet Посмотреть профиль Найти все сообщения от kostyanet
 
Регистрация: 23.10.2010
Сообщений: 2,718

А просто форму аякс отгружать не умеет?
Ответить с цитированием
  #5 (permalink)  
Старый 05.02.2014, 15:42
Аспирант
Отправить личное сообщение для DeUM Посмотреть профиль Найти все сообщения от DeUM
 
Регистрация: 27.02.2013
Сообщений: 36

Сообщение от kostyanet Посмотреть сообщение
А просто форму аякс отгружать не умеет?
Насколько я знаю нет!
$().serialize() // Только для простой(стандартной) формы: <form></form>
Ответить с цитированием
  #6 (permalink)  
Старый 05.02.2014, 15:53
Профессор
Отправить личное сообщение для kostyanet Посмотреть профиль Найти все сообщения от kostyanet
 
Регистрация: 23.10.2010
Сообщений: 2,718

В смысле вот так некошерно - http://www.simonerodriguez.com/ajax-...ubmit-example/ - ?

UPD, там такая же тряхомудия...

Последний раз редактировалось kostyanet, 05.02.2014 в 15:56.
Ответить с цитированием
  #7 (permalink)  
Старый 05.02.2014, 16:03
Профессор
Отправить личное сообщение для kostyanet Посмотреть профиль Найти все сообщения от kostyanet
 
Регистрация: 23.10.2010
Сообщений: 2,718

Я имел ввиду вот так

https://developer.mozilla.org/en-US/...rmData_Objects
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
требуется плагин для chrom Novychok Работа 0 02.10.2013 02:32
Chrome плагин для ввода многострочного Javascript-кода almac Javascript под браузер 1 29.06.2012 12:41
Скрипт для вставки личных данных в Опере praeeo Opera, Safari и др. 2 30.12.2010 11:52
Плагин jParallax для jQuery britanik jQuery 4 14.02.2010 12:11
Что за плагин используется для загрузки фотографий? Simon jQuery 0 13.12.2009 17:59