Показать сообщение отдельно
  #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
Ответить с цитированием