Форум

Vatanga · #1 (**permalink**) 22.02.2013, 17:31

Не подскажите какую связку взять для реализации функции: В форму на сайте Пользователь вбивает данные, нажимает кнопку печать и ему печатается документ. (форм пока нет ваши идеи на чем, шаблоны документов в Word'овском формате).

1. Какую связку технологий взять
2. Как настроить формы для печати, когда все размеры, на листе напечатанном, критичны к макету.
3. Данные запоминать не надо. Просто пользователь вбивает в удобные формы а ему из них формируются документы.

Мне нужен вектор куда "Копать".

Vatanga · #2 (**permalink**) 22.02.2013, 19:36

а нету чего-нибудь на JavaScript подобного

danik.js · #3 (**permalink**) 22.02.2013, 20:01

Парсеров word-документов на javascript - не встречал)

Vatanga · #4 (**permalink**) 22.02.2013, 20:06

наоборот из javaScript в документ годен для печати на принтере в виде официальных документов. (Необязательно Word)

DjDiablo · #5 (**permalink**) 22.02.2013, 21:57

Нет проблем, но скрипт конечно написать придётся, готовые вряд ли есть.

Тебе понадобится шаблонизатор, jquery, и немного терпения

Образец кода 1

<!DOCTYPE HTML>
<html>
  <head>
      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 </head>

  <body>
    <table width="100%">
      <tr>
        <td width="30%"> 
          <form >
            <input value="Текст 1 " id="a"/></br>
            <input value="текст 2 " id="b"/></br>
            <button id="print"> печать </button>
          </form>
        </td>
        <td width="70%">    
          <iframe id="result" style="width:100%"></iframe>
        </td>
      </tr>    
    </table>

    <script>
      $(function(){
        $("#print").click(function(){
          $('#result').contents().find('body').load('');

          //вместо это строчки нужен шаблонизатор
          $('#result').contents().find('body').html( $('#a').val()+$('#b').val() );

          window.frames['result'].focus();
          window.frames['result'].print();
          
          return false;
        })
      })
    </script>

  </body>
</html>

впринципе можно и без шаблонизатора обойтись, потребуется код вида
образец кода

var template='http://learn.javascript.ru/play';

$('#result').contents().find('body').load(template, function(){            

    //заполняем определённые id в шаблоне (шаблон это html как несложно догадаться), данные берём из формы.            
    $('#result').contents().find('el').html( $('#b').val() );
            
    window.frames['result'].focus();
    window.frames['result'].print();
});

DjDiablo · #6 (**permalink**) 22.02.2013, 22:35

чуточку дороботанный пример,
добавлен примитивный шаблонизатор.
поле tmpl в шаблоне указывает на id формы, откуда будет взято значение.

песочница

код/пример

<!DOCTYPE HTML>
<html>
  <head>
      <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
 </head>

  <body>
    <table width="100%">
      <tr>
        <td width="30%"> 
          <form id="templator">
            <input value="Текст 1 " id="a"/></br>
            <input value="текст 2 " id="b"/></br>
            <button id="print"> печать </button>
          </form>
        </td>
        <td width="70%">    
          <iframe id="result" style="width:100%">           
           </iframe>
          
        </td>
      </tr>    
    </table>

    <script>
      $(function(){

        // образец шаблона      
        var tmpl=' поле1=<b tmpl="a"></b></br>'
                  +' поле2=<b tmpl="b"></b></br>';
        
        $("#print").click(function(){
          
          var el=$('#result').contents().find('body');
          
          //вставим шаблон в фрейм
          el.html(tmpl);
          
          //шаблон можно загрузить и с сервера
          //$('#result').contents().find('body').load('')
          
          
          //шаблонизатор
          $('#templator input').each(function(){            
              var i=el.find( "[tmpl^='" + $(this).attr('id') + "']");
              i.html( $(this).val() )                              
          })
                    
          // печать
          window.frames['result'].focus();
          window.frames['result'].print();
          
          // отменим действие по умолчанию
          return false;
        })
      })
    </script>

  </body>
</html>

Vatanga · #7 (**permalink**) 23.02.2013, 16:35

Да то что надо, но встречный вопрос. Мне необходимо вставлять поля в разные документы, соответственно у меня будет много шаблонов. Как лучше оптимизировать код. Загружать отдельными html ( var template='http://learn.javascript.ru/play'; ) документами и в них вставлять или написать много "шаблоных переменных tmpl" и уже ими оперировать?
Поставить код загрузки файлов HTML непосредственно при нажатии кнопки данного типа?

Заранее спасибо пошел писать формы потом перейду к шаблонам ))

Форум

Справочник

Discord чат

Курсы javascript