Asp.net DropDownList that populates a key value pairs on one line

I would like to be able to select an exam from a drop down list and append all the question_id's that are paired with that exam on the same row instead of each question_id populating it's own row.  Currently I have a DDL where I select an exam and the it populates all question_id's on their own row.  
schema

  Schema

Controller
  public ActionResult NewExam(int? exam_id)
        {

            ViewBag.exam_id = new SelectList(db.exams.OrderBy(x => x.exam_desc), "exam_id", "exam_desc");


            var question = (from x in db.exams
                            join y in db.exam_question on x.exam_id equals y.exam_id
                            where x.exam_id == exam_id
                            select y).ToList();

            ViewBag.question_id = new SelectList(from x in question.OrderBy(x => x.question.question_id).ToList()
                                                 select new
                                                 {
                                                     question_id = x.question_id
                                                 }, "question_id", "question_text");

            return View();
        }

   public JsonResult Get(int ID)
        {
            db.Configuration.ProxyCreationEnabled = false;
            var questionID = (from x in db.exam_question
                              join e in db.exams on x.exam_id equals e.exam_id
                              where e.exam_id == ID
                              select new AddExam
                              {
                                  question_id = x.question_id
                              }).ToList();

            return Json(questionID, JsonRequestBehavior.AllowGet);
        }

Open in new window



View
@model nahpApplication.Models.ViewModel.AddExam

<div class="container">
    <div class="form-group">

        @Html.DropDownListFor(model => model.exam_id, ViewBag.exam_id as SelectList, "-- Select Exam --", new { @class = "form-control", id = "ExamID" })

        <div class="form-group">

            @Html.DropDownListFor(x => x.question_id, ViewBag.question_id as SelectList, "-- Select Question --", new { @class = "form-control", id = "question_id" })
        </div>

    </div>
</div>

<script src="~/Scripts/jquery-1.10.2.min.js"></script>


<script>
    $(document).ready(function () {
        $("#ExamID").change(function () {
            $.get('@Url.Action("Get", "user_exam")',
                { ID: $("#ExamID").val() }, function (data) {
                    $("#question_id").empty();
                    $.each(data, function (index, row) {
                        $("#question_id").append(" <option value='" + row.question_id + "'>" + row.question_id + "</option>")
                    });
                })
        });
    });
</script>

Open in new window



ViewModel
 public class AddExam
    {
        //exam
        public int exam_id { get; set; }
        public int credential_status_id { get; set; }
        public string exam_desc { get; set; }


        //exam questions
        public int exam_question_id { get; set; }
        public int question_id { get; set; }

    }

Open in new window


Any help or guidance would be appreciated.
lovettjayAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Kyle AbrahamsSenior .Net DeveloperCommented:
Do A join on your List
      var question = string.Join(",", (from x in db.exams
                            join y in db.exam_question on x.exam_id equals y.exam_id
                            where x.exam_id == exam_id
                            select y.ToString()).ToList());

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
lovettjayAuthor Commented:
Thanks for your assistance.  This works perfectly in a comma separated list.  How would this be passed in the view?  The javascript will only pass a single question_id at a time in drop down list.
0
Kyle AbrahamsSenior .Net DeveloperCommented:
The dropdown will pass whatever is bound to the value field.  So if you have the questions bound to that column or a list of strings then you'd be fine.  Without understanding exactly what you're trying to accomplish it's hard to tell you what to do.
0
OWASP: Avoiding Hacker Tricks

Learn to build secure applications from the mindset of the hacker and avoid being exploited.

lovettjayAuthor Commented:
After I select an exam I would like all the matching questions on one line on a comma separated list?  

After I select the exam: 8188, 8189, 3916, 3917, 3918, 3919, 3920....... all on the same line

You gave me the above code, I apologize I don't know how to plug it in the achieve the desired result
  var question = string.Join(",", (from x in db.exams
                            join y in db.exam_question on x.exam_id equals y.exam_id
                            where x.exam_id == exam_id
                            select y.ToString()).ToList());

Open in new window



Not...
DDL picture


Javascript:
<script>
    $(document).ready(function () {
        $("#ExamID").change(function () {
            $.get('@Url.Action("Get", "user_exam")',
                { ID: $("#ExamID").val() }, function (data) {
                    $("#question_id").empty();
                    $.each(data, function (index, row) {
                        $("#question_id").append(" <option value='" + row.question_id + "'>" + row.question_id + "</option>")
                    });
                })
        });
    });
</script>

Open in new window

0
Kyle AbrahamsSenior .Net DeveloperCommented:
<option value='" + row.question_id + "'>"

you can update that to use the new questions.  Just adjust your viewbag to be the questions definition rather than question_id
0
lovettjayAuthor Commented:
Thanks for your assistance, I think I'm almost there.....

<script>
   $(document).ready(function () {
        $("#ExamID").change(function () {
            $.get('@Url.Action("Get", "user_exam")',
                { ID: $("#ExamID").val() }, function (data) {
                    $("#QuestionOrder").empty();   
                    //$.each( JSON.parse(data), function(index, row) {
                    //    $("#QuestionOrder").append(" <option value='" + row.question_id + "'>")
                    //})
                    $.each(data, function (index, row) {
                        $("#QuestionOrder").append(" <option value='" + row.question_id + "'>")
                    });                                                 
                })
        });
    });
</script>

Open in new window


When inspecting in the console I get the following error: Uncaught TypeError: Cannot use 'in' operator to search for '1033' in 8188,8189,8190,3916,3917,3918.......for the rest of the questions.  I tired to JSON.parse as well with no luck.


Controller
      public ActionResult NewExam(int? exam_id)
        {

            ViewBag.exam_id = new SelectList(db.exams.OrderBy(x => x.exam_desc), "exam_id", "exam_desc");



            var exam_question_order = string.Join(",", (from x in db.exams
                                             join y in db.exam_question on x.exam_id equals y.exam_id
                                             join z in db.questions on y.question_id equals z.question_id
                                             where x.exam_id == exam_id
                                             select z.question_id.ToString()).ToList());

            ViewBag.exam_question_order = new SelectList(from x in exam_question_order
                                                         select x).ToList();

            return View();
        }

        public JsonResult Get(int ID)
        {
            db.Configuration.ProxyCreationEnabled = false;
            var exam_question_order = string.Join(",", (from x in db.exams
                                                        join y in db.exam_question on x.exam_id equals y.exam_id
                                                        join z in db.questions on y.question_id equals z.question_id
                                                        where x.exam_id == ID
                                                        select z.question_id.ToString()).ToList());

            return Json(exam_question_order, JsonRequestBehavior.AllowGet);
        }

Open in new window

0
Kyle AbrahamsSenior .Net DeveloperCommented:
where x.exam_id == exam_id

since exam_id is int?  is x.Exam_ID the same type?  You may need exam_id.Value
0
lovettjayAuthor Commented:
exam_id and EXAM_ID are both the same type of int.  


<script>
    $(document).ready(function () {
        $("#ExamID").change(function () {
            $.get('@Url.Action("Get", "user_exam")',
                { exam_id: $("#ExamID").val() }, function (data) {
                    $("#question_id").empty();
                   // $.each(JSON.parse(data), function(index, row) {
                    //$.each($.parseJSON(data), function (index, row) {
                    $.each(data, function (index, row) {
                        $("#question_id").append(" <option value='" + row.question_id + "'>" + row.question_id + "</option>")
                    });
                })
        });
    });
</script>

Open in new window



When inspecting the gives me: Uncaught TypeError: Cannot use 'in' operator to search for '1033' in 8188,8189,8190,3916,3917,3918,3919,3920...the rest of the questions.   In the XHR I see the questions_id listed out 8188, 8189, 8190......

So I tried to use Json.parse and $.parseJSON and they both give me the same syntax error: Uncaught SyntaxError: Unexpected token , in JSON at position 4. In the XHR I see the questions_id listed out 8188, 8189, 8190......
0
Kyle AbrahamsSenior .Net DeveloperCommented:
use includes instead of in, but note that you have to wrap the string and the value in delimiters to prevent false positives.

eg:

question Ids:
1,11,111

Look for 1
Look for ",1,11,111,".includes(",1,");


More on includes here:
https://www.w3schools.com/jsref/jsref_includes.asp
0
lovettjayAuthor Commented:
Thanks for your assistance.  I'm still struggling to piece everything together.  I have been trying to search for anything that will give me an example of a comma separated list after selecting an item.   What would be an appropriate google search?
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.