Вход • Регистрация

Присвоение индивидуального ID каждому input или другим значениям формы

  •
  • 25 июня 2012 г. , редакция: 25 июня 2012 г.
  • Через конструктор формы не вижу опции для присвоения уникального значения ID для каждого input и других значений. Мне вот нужно в CSS задавать полям (input и другим) индивидуальные характеристики (высоту, ширину и т. п.). Чтобы, например, у одного input был width: 200px; height: 40px;, а у другого - width: 300px; height: 50px;.

    В данном случае я могу задать только одинаковые характеристики для всех input так как во всех штампуется одинаковый class - inptext :(

    Не подскажете как можно это сделать?
  • 26 июня 2012 г.
  • использовать $row["id"]
    например так
    Код
    class="inptext element_'.$row["id"].'"
    • 26 июня 2012 г. , редакция: 26 июня 2012 г.
    • Евгений, спасибо! Получилось.
      Добавляются разные параметры к существующим классам inptext: class="inptext element_4", class="inptext element_5", class="inptext element_6" и так далее.

      Хотя я предполагал добавление ID. Например - <input type="text" name="p5" size="40" value="" class="inptext" id="element_4">, <input type="text" name="p6" size="40" value="" class="inptext" id="element_5"> и так далее.
      •
      • 26 июня 2012 г.
      • А какая разница? Правьте view, там можно как угодно вывод настроить
        Сделайте
        Код
        class="inptext" id="element_'.$row["id"].'"
        •
        • 26 июня 2012 г. , редакция: 26 июня 2012 г.
        • А, въехал. Спасибо, Виталий!

          UPDATE
          Всё получилось. Пасибо!
        • 26 июня 2012 г.
        • строго говоря, разница есть : ))

          элемент с ID должен быть единственным на всем сайте
          например
          id="menu"
          id="contacts"

          повторение недопускается

          применение id целесообразно если надо сделать якорь на него или обращение посредством document.getElementById()

          ну и по мелочам - у ID выше вес в css нежели у class
          class можно делать множественным (через пробел class="name1 name2 name3"), а id нельзя

          так что аккуратнее с id : ))

          но, да, разницы нет в том плане что я показал лишь пример, а в воле Артура применить хоть class хоть id (пример он на то и "пример")
          •
          • 26 июня 2012 г.
          • Да, спасибо, понял. Я вот только смотрю, что некоторые вроде хорошие спецы напрополую используют ID, а некоторые классы. Меня собственно волнует этот вопрос ... Как правильнее и лучше делать.
            •
            • 26 июня 2012 г.
            • в вашем случае я не вижу причин применять id
              вполне можно обойтись class

              а id применять только к уникальным единственным на всем сайте элементам

              погуглите по запросу id или class
              найдете немало хороших материалов на эту тему
          •
          • 27 июня 2012 г.
          • Цитата
            строго говоря, разница есть : ))

            Я не про эту разницу, Евгений, я про отсутствие разницы в реализации
            • 27 июня 2012 г.
            • Виталий, само собой. : ))

              Цитата
              но, да, разницы нет в том плане что я показал лишь пример, а в воле Артура применить хоть class хоть id (пример он на то и "пример")
  •
  • 26 июня 2012 г.
  • Вот, форма у Связного сплошь из ID состоит. Это правильно? Хороший код?

    Код

    <form action="" method="post" autocomplete="off" name="flight" id="flight">
    <fieldset>
    <div class="params">
    <div class="columns-double">
    <div class="column-left">
    <div class="in">
    <div class="in-wrap">
    <input type="text" id="from_city" name="from_city" value="" tabindex="1" placeholder="Откуда" rel="Откуда"
    onFocus="this.value = ''; this.form.from_code.value = ''; return true;" />
    <input type="hidden" name="from_code" value="" id="from_code" />
    <span class="code"></span>
    </div>
    <div class="example">
    <a href="#MOW">Москва</a>,&nbsp; <a href="#LED">Санкт-Петербург</a>
    <!--a href="#MOW">Москва</a>,&nbsp; <a href="#TAS">Ташкент</a>,&nbsp; <a href="#LED">Питер</a>,&nbsp;
    <a href="#UFA">Уфа</a>,&nbsp; <a href="#ROV">Ростов-на-Дону</a-->
    </div>
    </div>
    </div>
    <div class="column-right">
    <div class="in">
    <div class="in-wrap">
    <input type="text" id="to_city" name="to_city" value="" tabindex="2" placeholder="Куда" rel="Куда"
    onFocus="this.value = ''; this.form.to_code.value = ''; return true;" />
    <input type="hidden" name="to_code" value="" id="to_code" />
    <span class="code"></span>
    </div>
    <div class="example">
    <a href="#MIA">Майами</a>,&nbsp; <a href="#BCN">Барселона</a>,&nbsp; <a href="#LON">Лондон</a>,&nbsp; <a href="#AER">Сочи</a>
    <!--a href="#KIV">Кишинёв</a>,&nbsp; <a href="#SIP">Симферополь</a>,&nbsp; <a href="#MOW">Москва</a>,&nbsp;
    <a href="#KZN">Казань</a>,&nbsp; <a href="#LED">Питер</a>,&nbsp; <a href="#UFA">Уфа</a-->
    </div>
    </div>
    </div>
    <div class="empty"></div>
    </div> <!-- /columns-double -->
    <div class="columns-triple">
    <div class="column-left">
    <div class="in date">
    <div class="in-wrap">
    <div class="date-wrap">
    <input type="text" id="from_date" name="from_date" value="" placeholder="Дата туда" tabindex="3" />
    </div>
    <span class="icon-calendar" onClick="document.forms['flight'].from_date.focus(); return true;"></span>
    <a href="#prev" class="prev none"></a>
    <a href="#next" class="next none"></a>
    </div>
    </div>
    </div>
    <div class="column-middle">
    <div class="in-direction">
    <ul id="direction_lavalamp">
    <li class="current">
    <a href="#1" id="value_1"><span class="from"></span></a>
    </li>
    <li>
    <a href="#2" id="value_2"><span class="from-to"></span></a>
    </li>
    <li class="knob"></li>
    <li class="bg"></li>
    </ul>
    <input type="hidden" name="direction" value="" id="direction" />
    </div>
    </div>
    <div class="column-right">
    <div class="in date disabled">
    <div class="in-wrap">
    <div class="date-wrap">
    <input type="text" id="to_date" name="to_date" value="" placeholder="Дата обратно" tabindex="4" />
    </div>
    <span class="icon-calendar" onClick="document.forms['flight'].to_date.focus(); return true;"></span>
    <a href="#prev" class="prev none"></a>
    <a href="#next" class="next none"></a>
    </div>
    </div>
    </div>
    <div class="empty"></div>
    </div> <!-- /columns-triple -->
    <div class="columns-quadro">
    <div class="column-1">
    <div class="sel sel-adults">
    <label for="adults">Взрослые:</label>
    <div class="sel-wrap">
    <ul id="adults_lavalamp">
    <li class="current">
    <a href="#1" id="value_1">1</a>
    </li>
    <li>
    <a href="#2" id="value_2">2</a>
    </li>
    <li>
    <a href="#3" id="value_3">3</a>
    </li>
    <li>
    <a href="#4" id="value_4">4</a>
    </li>
    <li>
    <a href="#5" id="value_5">5</a>
    </li>
    <li class="knob"></li>
    <li class="bg"></li>
    </ul>
    <input type="hidden" name="adults" value="1" id="adults" />
    </div>
    </div>
    </div>
    <div class="column-2">
    <div class="sel sel-adults">
    <label for="childs_12">Дети 2-12 лет:</label>
    <div class="sel-wrap">
    <ul id="childs_12_lavalamp">
    <li class="current">
    <a href="#0" id="value_0">0</a>
    </li>
    <li>
    <a href="#1" id="value_1">1</a>
    </li>
    <li>
    <a href="#2" id="value_2">2</a>
    </li>
    <li>
    <a href="#3" id="value_3">3</a>
    </li>
    <li>
    <a href="#4" id="value_4">4</a>
    </li>
    <li class="knob"></li>
    <li class="bg"></li>
    </ul>
    <input type="hidden" name="childs_12" value="0" id="childs_12" />
    </div>
    </div>
    </div>
    <div class="column-3">
    <div class="sel sel-infants">
    <label for="childs_2">Дети до 2 лет:</label>
    <div class="sel-wrap">
    <ul id="childs_2_lavalamp">
    <li class="current">
    <a href="#0" id="value_0">0</a>
    </li>
    <li>
    <a href="#1" id="value_1">1</a>
    </li>
    <li>
    <a href="#2" id="value_2">2</a>
    </li>
    <li class="knob"></li>
    <li class="bg"></li>
    </ul>
    <input type="hidden" name="childs_2" value="0" id="childs_2" />
    </div>
    </div>
    </div>
    <div class="column-4">
    <div class="in-class">
    <label for="cs">Класс обслуживания:</label>
    <div class="in-class-wrap">
    <ul id="cs_lavalamp">
    <li class="current">
    <a href="#E" id="value_E">Эконом</a>
    </li>
    <li>
    <a href="#B" id="value_B">Бизнес</a>
    </li>
    <li class="knob"></li>
    <li class="bg"></li>
    </ul>
    <input type="hidden" name="cs" value="E" id="cs" />
    </div>
    </div>
    </div>
    <div class="empty"></div>
    </div> <!-- /columns-triple -->
    </div>
    </fieldset>
    <div class="bt">
    <div class="bt-wrap">
    <input type="submit" name="submit" value="Найти"
    onFocus="this.blur(); return true;"
    _onClick="_gaq.push(['_trackEvent', 'Avia', 'Search', this.form.from_code.value + '-' + this.form.to_code.value);" />
    </div>
    </div>
    </form>
    •
    • 26 июня 2012 г.
    • Цитата
      применение id целесообразно если надо сделать якорь на него или обращение посредством document.getElementById()



      вполне возможно что у связного это необходимо (по одному только html-коду этого не понять)


      в вашем же случае (когда вы хотите только размеры и прочие стили править индивидуально), вы можете обойтись class
  •
  • 26 июня 2012 г.
  • Чисто моё мнение, что вёрстку надо обязательно делать классами, а элементы которые используют динамику на страницы должны иметь свой индефекатор id, так легче и глазу воспринять, и образно отделить динамику в коде...
  •
  • 07 февраля 2013 г.
  • В shop.view.param.php хочу добавить индивидуальный класс, дописываю как тут написано echo ': <span class="shop_param_value_'.$row["id"].'">'; Но что то циферка не выводиться, или в этой версии что то изменилось?
    •
    • 07 февраля 2013 г. , редакция: 07 февраля 2013 г.
    • Если перед
      Код
      echo ': <span class="shop_param_value_'.$row["id"].'">';

      написать
      Код
      print_r($row);

      и выведется массив в котором будет [id] => ???
      то тогда должно работать, но я подозреваю что такого элемента в массиве нет как минимум. или такого массива нет в том месте.
      Ошибок то не выводит никаких чтоли Error где нибудь на странице обычно ссылка вверху сам еррор внизу.
      • 07 февраля 2013 г.
      • нет ошибок не выводит. Ну а как в этом файле еще можно сделать индивидуальный класс для контейнера параметра? Может другой способ есть? Мне надо разные параметры, по разному оформить в карточке товара.
        •
        • 07 февраля 2013 г.
        • print_r($row); что выводит?
          •
          • 07 февраля 2013 г.
          • тоже ничего
            •
            • 07 февраля 2013 г.
            • Я вот тут подумал что нужно порядковый номер параметра сюда вписывать.
              Надо поискать где его можно взять.
    •
    • 08 февраля 2013 г.
    • О какой версии идет речь?
      Если версия последняя, то сейчас в shop.view.param.php цикл начинается с
      Код
      foreach ($result["rows"] as $param)
      {

      т.е. id находится в $param['id'], а не $row["id"]
      •
      • 08 февраля 2013 г.
      • Да, версия последняя. Спасибо - буду пробовать.

Новости

  • Не пропустите сборку DIAFAN.CMS 7.1.4
  • 24 апреля, среда
  • В новой сборке совершили революцию в структурировании кастомизированной информации в шаблонах, добавили авторегистрацию пользователей, усовершенствовали защиту от спама, актуализировали накопительную скидку, а также улучшили производительность и стабильность работы системы.
  • Сборка DIAFAN.CMS 7.1.3
  • 12 января
  • После выхода сборки 7.1 мы выпустили уже три патча, в каждом из которых улучшаем административную часть сайта. Сборка DIAFAN.CMS 7.1.3 уже доступна к установке. 
  • Новость. Сборка. Тарифы
  • 15 декабря 2023 г.
  • Подводим итоги 2023 года. Выпустили новую сборку DIAFAN.CMS 7.1.1, вводим новые тарифы на аренду сайта и коммерческую поддержку и автообновления с января 2024 г., строим планы на будущий год.
Все новости