Asp.Net MVC: формы, являющиеся блочными элементами

Question

По сути, иметь несколько форм подряд невозможно, насколько я видел.

LastUpdate

Учитывая ситуацию с телефонами и непредсказуемый характер того, как большинство браузеры отображают страницу, я думаю Я должен идти с несколькими кнопками на форма. Не очень доволен этим, так как это похоже на взлом WebForms для MVC но это имеет смысл для ситуация. Создание сложного интерфейса для мобильные устройства жестки в WebForms, в MVC выглядит сложнее.

Что-то, для чего я снова был представлен, это идея иметь несколько форм на страницу, чтобы вы могли размещать кнопки на разных контроллерах. Проблема в том, что оказывается, что форма является блочным элементом, поэтому невозможно нажать кнопку рядом друг с другом. (Почему они являются блочными элементами, я бы хотел знать.)

Теперь вот основная проблема, это сайт, созданный для просмотра на большинстве телефонов с браузером. У этого также есть много кнопок из-за кнопок, намного легче нажимать с сенсорными телефонами как iPhone. Плавающий не может (не полностью исключен) вариант, так как плавание не очень предсказуемо на телефонах. Inline иногда работает иногда не с браузерами, как я видел.

Это довольно большая проблема с точки зрения дизайна, и я надеюсь, что есть какой-то метод MVC для создания магической кнопки, которая будет работать.

Пояснение:

Я думаю, что лучший способ это сделать - я использую несколько кнопок в качестве ссылок. В версии WebForms было несколько кнопок, которые в основном просто перенаправлялись. Итак, имея в виду:

Скажем, у меня есть три кнопки, но все три нужно будет публиковать на разных страницах. Это предполагает 3 различных формы. К сожалению, это также означало бы, что все три кнопки теперь будут отображаться как элементы блока. (Даже если это форма, вызывающая это.) Может быть, я должен спросить, есть ли в MVC способ отправить обратно на тот же контроллер для перенаправления оттуда? Перенаправление я сделал, так что это не имеет большого значения. Публикация в контроллере и оценка кнопки на основе ее значения у меня нет, но это почти похоже на попытку воссоздать функцию обратной передачи WebForms.

Пример http://www.eythere.com/images/eythere.jpg

На этом изображении три верхние кнопки являются просто ответными реакциями на перенаправления.

UPDATE:

Попытка таблиц и плавающих div. Таблицы не очень хорошо работают с небольшими телефонами, такими как Razors, так как они, как правило, игнорируют TD и просто создают большой вертикальный столбец.

Пробовал плавающие дивы, например:

<div >
  <form >
   <input type="submit" style="float:left;"/>
  </form>
  <form>
   <input type="submit" style="float:left;"/>
  </form>
  <form>
   <input type="submit" style="float:left;"/>
  </form>
 </div>

Проблема в том, что кнопки отображаются в два ряда (это нормально), но две кнопки в одном ряду не выровнены по вертикали. Второй немного выключен. Почти до такой степени, что он выглядит как скобка Финала четырех.

Возможно, придется перейти с несколькими кнопками к форме. Это, кажется, противоречит дизайну MVC, но я не вижу другого пути для этого.

Answer 1

Когда вы публикуете форму, атрибут имени кнопки, использованной для ее публикации, отправляется как значение формы. Присвойте каждой кнопке имя, а затем проверьте в коллекции форм (или посреднике Asp.Net MVC) название кнопки.

if(!String.IsNullOrEmpty(Request.Form["myButtonName"])) {
    //myButtonName has been pressed.
}

EDIT:

Проблема в том, что форма является блочным элементом, поэтому невозможно перейти к кнопке рядом друг с другом. (Почему они являются блочными элементами, я бы хотел знать.)

Формы являются блочными элементами, потому что, если бы они были встроенными элементами, было бы недопустимо вкладывать в них теги типа p и div (оба из которых удобны при построении форм).

Answer 2

Если я понимаю, что вы спрашиваете, то извините, что нет такой функции. Вам нужно будет найти или создать свой собственный метод, который идентифицирует клиента, а затем выведет правильный HTML-код и CSS, чтобы приспособить это устройство. Может быть, лучше найти решение на стороне пользователя кода. Вы можете использовать display: inline; подделать кнопку, чтобы действовать как встроенный элемент, несмотря ни на что. Он должен работать во всех основных браузерах (http://www.quirksmode.org/css/display.html),, и это, вероятно, включает браузер iPhone, потому что он основан на сафари.

Answer 3

Возможно, было бы полезно, если бы вы могли объяснить немного больше о том, как вы хотите, чтобы материал взаимодействовал. Тем не менее, ни один закон не гласит, что форма может иметь только одну кнопку отправки, и при отправке можно выяснить, какая кнопка нажата - название / значение (текст) кнопки появятся в опубликованных данных. Точно так же, как справиться с этим, действительно нужно то, что должно произойти, и как вы хотите его сконструировать, но вы определенно можете придать форме несколько кнопок.

- ОБНОВЛЕНИЕ -

Спасибо за разъяснения. Я думаю, что вам лучше всего использовать обычные ссылки и немного их стилизовать:

a.button { display: block; width: 100px; float: left; }

Они должны быть хорошими большими интерактивными вещами в iTouches и других более современных мобильных телефонах и хорошо деградировать в старых мобильных устройствах, поскольку на самом деле нет ничего, что может сделать HTML, который не поддерживает ссылки.

Answer 4

Я не пробовал это, поэтому я не могу сказать, будет ли это работать или нет, но не могли бы вы просто установить формы на странице "display: inline"?

Answer 5

Используйте CSS для стилизации ссылок, таких как кнопки. Таким образом вы избавитесь от ненужных форм и сохраните доступность и кликабельность.

Answer 6

это может решить вашу проблему

другое решение: если вы можете использовать javascript, создайте DIV и нажмите на него мышкой

как то, что Джефф сделал здесь на SO с [Голоса] | [Ответы] | [Просмотры] «кнопка» на главной странице слева от каждого вопроса

Answer 7

Кнопки HTML не должны быть внутри форм. У вас может быть кнопка с обработчиком javascript onclick, которая делает все что угодно, например, устанавливает действие формы и отправляет ее, или загружает новый документ.

<input type="button" value="Home"
  onclick="location.href='/index.php'" />
<input type="button" value="Rooms"
  onclick="var f=document.getElementById('myform');f.submit()" />
<input type="button" value="Create"
  onclick="var f=document.getElementById('myform');f.action='/create.php';f.submit()" />

Эти кнопки затем можно стилизовать любым способом.

Если ваша форма не собирает данные, тогда все ваши кнопки могут вести себя как кнопка "Домой" в моем примере.

Answer 8

Если вы не собираете данные от пользователя, они просто выглядят как простые ссылки.