Rajeshyadav12 Ответов: 2

Как отправить выбранные значения listbox из одного listbox в другой в ASP.NET MVC без использования клиентского кода


I want to send selected listbox values to another listbox. I want to implement this using C# code in controller section but not with JavaScript code.

I got stuck here. I am generating integer values and want to select these values to send to another list box and vice-versa.


Что я уже пробовал:

public class NumberClass
  {
    public IEnumerable<SelectListItem> leftnumbers { get; set; }
    public IEnumerable<int> leftSelectednumbers { get; set; }

    public IEnumerable<SelectListItem> rightnumbers { get; set; }
    public IEnumerable<int> rightSelectednumbers { get; set; }
  }


[HttpGet]
      public ActionResult Index()
      {
        List<SelectListItem> items = new List<SelectListItem>();

        for (int i = 1; i <= 20; i++)
        {
            SelectListItem selectList = new SelectListItem()
            {
                Text = i.ToString(),
                Value = i.ToString()

            };

            items.Add(selectList);

        }

        NumberClass num = new NumberClass()
        {
            leftnumbers = items,
            rightnumbers = null

        };
        return View(num);

    }


    [HttpPost]
    public string Index(IEnumerable<int> selectedvalue)
    {
        if (selectedvalue == null)
        {
            return "you have not selected";
        }
        else
        {
            //
            return;
        }

    }


@using (Html.BeginForm())
{
  <div class="col-md-6" style="font-family:Arial">
    @Html.ListBoxFor(m => m.leftSelectednumbers, Model.leftnumbers, new { size = 20, @class = "listBox" })
    <br />
    <input type="submit" value="move left" />
</div>

<div class="col-md-6" style="font-family:Arial">

    @Html.ListBoxFor(m => m.leftSelectednumbers, new List<SelectListItem>(), new { size = 20, @class = "listBox" })
    <br />
    <input type="submit" value="move right" />
</div>

}

Christian Graus

Использование серверной части для взаимодействия элементов пользовательского интерфейса-ужасная идея. В основном вам нужно будет отправить выбранные параметры из коробки один на задний конец, который просто возвращает их, а затем отправить их обратно вниз, чтобы поместить в другую коробку. Если вы хотите, чтобы серверная часть знала, какие элементы находятся в списке, отправьте эту информацию, но после заполнения пользовательского интерфейса в javascript

2 Ответов

Рейтинг:
14

F-ES Sitecore

Проблема с полями select \ list заключается в том, что при отправке формы вместе с формой отправляются только выбранные элементы, поэтому если у вас есть 20 элементов в поле select, выберите 3 из них и отправьте форму, то ваш код контроллера понятия не имеет, сколько элементов было в вашем списке изначально, только то, что пользователь выбрал три из них.

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

Обновленная модель

public class NumberClass
{
    public string currentLeftNumbers { get; set; }
    public IEnumerable<SelectListItem> leftnumbers { get; set; }
    public IEnumerable<int> leftSelectednumbers { get; set; }

    public string currentRightNumbers { get; set; }
    public IEnumerable<SelectListItem> rightnumbers { get; set; }
    public IEnumerable<int> rightSelectednumbers { get; set; }
}


Смотреть

@using (Html.BeginForm())
{
    <input type="hidden" name="CurrentLeftNumbers" value="@Model.currentLeftNumbers"/>

    <div class="col-md-6" style="font-family:Arial">
        @Html.ListBoxFor(m => m.leftSelectednumbers, Model.leftnumbers, new { size = 20, @class = "listBox" })
        <br />
        <input type="submit" value="move right" />
    </div>

    <input type="hidden" name="CurrentRightNumbers" value="@Model.currentRightNumbers" />

    <div class="col-md-6" style="font-family:Arial">

        @Html.ListBoxFor(m => m.rightSelectednumbers, Model.rightnumbers, new { size = 20, @class = "listBox" })
        <br />
        <input type="submit" value="move left" />
    </div>
}


Контроллер

[HttpGet]
public ActionResult Index()
{
    List<int> items = new List<int>();

    for (int i = 1; i <= 20; i++)
    {
        items.Add(i);
    }

    NumberClass num = GetModel(items, new List<int>());

    return View(num);
}

[HttpPost]
public ActionResult Index(NumberClass model)
{
    List<int> left = GetNumbers(model.currentLeftNumbers);
    List<int> right = GetNumbers(model.currentRightNumbers);

    if (model.leftSelectednumbers != null)
    {
        foreach (var i in model.leftSelectednumbers)
        {
            left.Remove(i);
            right.Add(i);
        }
    }

    if (model.rightSelectednumbers != null)
    {
        foreach (var i in model.rightSelectednumbers)
        {
            right.Remove(i);
            left.Add(i);
        }
    }

    return View(GetModel(left, right));
}

private List<int> GetNumbers(string numbers)
{
    if (string.IsNullOrWhiteSpace(numbers))
    {
        return new List<int>();
    }
    else
    {
        return numbers.Split(new char[] { ',' }, StringSplitOptions.RemoveEmptyEntries).Select(n => int.Parse(n)).ToList();
    }
}

private NumberClass GetModel(IEnumerable<int> left, IEnumerable<int> right)
{
    NumberClass model = new NumberClass();

    if (left.Any())
    {
        model.currentLeftNumbers = left.Select(n => n.ToString()).Aggregate((x, y) => x + "," + y);
        model.leftnumbers = left.OrderBy(x => x).Select(n => new SelectListItem { Value = n.ToString(), Text = n.ToString() });
    }
    else
    {
        model.leftnumbers = new List<SelectListItem>();
    }
            
    if (right.Any())
    {
        model.currentRightNumbers = right.Select(n => n.ToString()).Aggregate((x, y) => x + "," + y);
        model.rightnumbers = right.OrderBy(x => x).Select(n => new SelectListItem { Value = n.ToString(), Text = n.ToString() });
    }
    else
    {
        model.rightnumbers= new List<SelectListItem>();
    }

    return model;
}


Вероятно, вам придется пройти через код, чтобы увидеть, как он работает.


Rajeshyadav12

Спасибо за ваш ответ. Еще один вопрос, который я хотел бы задать. Я также хочу провести проверку на стороне клиента. Мы не можем переместить все элементы из одного списка в другой. В списке должен быть хотя бы один элемент. Не могли бы вы также подсказать мне, как это сделать? Спасибо за вашу помощь.

Рейтинг:
0

Christian Graus

Использование серверной части для взаимодействия элементов пользовательского интерфейса-ужасная идея. В основном вам нужно будет отправить выбранные параметры из коробки один на задний конец, который просто возвращает их, а затем отправить их обратно вниз, чтобы поместить в другую коробку. Если вы хотите, чтобы серверная часть знала, какие элементы находятся в списке, отправьте эту информацию, но после заполнения пользовательского интерфейса в javascript


Rajeshyadav12

Спасибо за ваш комментарий. Не могли бы вы подробнее рассказать, чтобы лучше понять.

Christian Graus

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

Rajeshyadav12

Спасибо, что направили меня. Я постараюсь написать для этого какой-нибудь JavaScript-код.

Christian Graus

Отлично - вам в значительной степени придется это сделать