addEventListeners overwrites other EventListeners - addeventlistener

I'm writing a script that will create an additional button 'heart' to copy link to clipboard.
var AllReferenceNode = document.getElementsByClassName('rowid-link');
for (var i = 0; i < AllReferenceNode.length; i++) {
var XnewNode = document.createElement('a');
XnewNode.innerHTML = "<span class='icon fa fa-heart'></span>";
XnewNode.id = AllReferenceNode[i].getAttribute("href");
XnewNode.className = "QKCopyLink";
XnewNode.href = "javascript:void(0);";
AllReferenceNode[i].after(XnewNode);
}
var Links = document.getElementsByClassName('QKCopyLink');
for (var i = 0; i < Links.length; i++) {
//console.log(i);
var href = document.getElementsByClassName('rowid-link')[i].getAttribute("href");
//console.log(dupa);
//console.log(document.getElementById(dupa));
document.getElementById(href).addEventListener('click', function(){
var dummy = document.createElement('input');
//var copyText = document.getElementsByClassName("rowid-link").getAttribute("href");
document.body.appendChild(dummy);
dummy.value = href;
dummy.select();
document.execCommand('copy');
document.body.removeChild(dummy);
});
}
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<script src="https://cdn.jsdelivr.net/npm/clipboard#2/dist/clipboard.min.js"></script>
<h6 class="history-title">Sat, 2019-11-16, 03:52
| Notes
|
<span class="username">USER</span>
<a href="#1-2LS7J5O" class="rowid-link">
<span class="icon bookmark fa fa-cloud"></span></a>
<span class="history-reply">
[reply]
</span>
</h6>
<h6 class="history-title">Sat, 2019-11-16, 03:52
| Notes
|
<span class="username">USER</span>
<a href="#1-2LS7v5O" class="rowid-link">
<span class="icon bookmark fa fa-cloud"></span></a>
<span class="history-reply">
[reply]
</span>
</h6>
<h6 class="history-title">Sat, 2019-11-16, 03:52
| Notes
|
<span class="username">USER</span>
<a href="#1-2LS7JdO" class="rowid-link">
<span class="icon bookmark fa fa-cloud"></span></a>
<span class="history-reply">
[reply]
</span>
</h6>
<h6 class="history-title">Sat, 2019-11-16, 03:52
| Notes
|
<span class="username">USER</span>
<a href="#1-2LS7JaO" class="rowid-link">
<span class="icon bookmark fa fa-cloud"></span></a>
<span class="history-reply">
[reply]
</span>
</h6>
The problem is that last run of the loop overwrites all events - all "hearts" copy the same link which is the last one. It looks like events are overwriten, but not sure how's this possible since I point element on which event listener should be set:
document.getElementById(href).addEventListener('click', function(){...
Please explain me why this is happening.

Changing:
dummy.value = href;
to this:
dummy.value = this.id;
Fixed the issue.

Related

Why does the clone remove method doesn't work after the function was altered?

I have been trying to delete specific clone data using JQuery -UI. i had to change my functions recently since then the remove button doesn't work. Please help me find my error.
My whole function that includes, Multidimensional Arrays along with form cloning! check out my remove function which i think has no problem in it.
$(function() {
var questionHolder = $('.question').clone(true);
$("#addQuestion").on('click', function(e) {
e.preventDefault();
var str = $("p.number:last").text(),
newValue = parseInt(str, 10) + 1;
var newQ = questionHolder.clone();
newQ.find('input, textarea')
.each(function() {
this.name = this.name.replace(/\[(\d+)\]/, '[' + newValue + ']');
})
.end()
.find('.number')
.html(newValue)
.end()
.appendTo('#questioncontainer')
.after('<br><button class="addQuestion_delete btn btn-danger" type="button">Remove Parent Clone</button><br>');
$(".addQuestion_delete").click(function(e) {
$(this).closest("#questioncontainer").remove();
e.preventDefault();
});
});
$('body').on('click', '.addAnswer', function(e) {
e.preventDefault();
var group = $(this).parent();
parent = $(this).parent().parent();
group.find(".answer:last")
.clone(true)
.find('input, textarea')
.each(function() {
this.name = this.name.replace(/\[(\d+)\]$/,
function(str, p1) {
return '[' + (parseInt(p1, 10) + 1) + ']';
});
})
.end()
.appendTo(
group.find('.answerContainer'))
.after('<button class="addAnswer_delete btn btn-danger" type="button"><i class="fa fa-minus"></i>Remove Child clone</button><br><br><br>');
$(".addAnswer_delete").click(function(e) {
$(this).closest(".answerContainer").remove();
e.preventDefault();
});
});
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- parent container -->
<div id="questioncontainer">
<!-- parent that clones -->
<div style="border:1px solid black; width:400px; padding:20px; margin-bottom:10px;" class="question border p-5 mt-3 shadow">
<!-- clone items inputs/textareas/files -->
<div class="row">
<div class="col-lg-6">
<!-- Educational Institute -->
<input oninput="checkCompany()" id="company" name="employer[1]" type="text" class="input-form track track_exp_qua" data-score=20>
<span class="bar"></span>
<label class="input-label"> Company <span id="text" class="required"> </span></label>
<!-- Educational Institute -->
<p class="validate text-danger pt-2" id="company_error"></p>
</div>
<div class="col-lg-6">
<!-- Job title -->
<input oninput="checkJobTitle()" id="job_title" name="job_title[1]" type="text" class="input-form track track_exp_qua" data-score=10>
<span class="bar"></span>
<label class="input-label"> Job Title <span id="text" class="required"> </span></label>
<!-- Job title -->
<p class="validate text-danger pt-2" id="job_title_error"></p>
</div>
</div>
<div class="justify-content-center pb-4">
<h4>Below is the child clone</h4>
</div>
<!-- child container -->
<div style="border:1px solid red; padding:20px;" class="answerContainer">
<div class="answer">
<div class="row">
<!-- best project url -->
<div class="col-lg-6">
<input name="best_project[1][1]" type="text" class="input-form track track_exp_qua" data-score=10>
<span class="bar"></span>
<label class="input-label">Best Project<small style="color:#FFBF00;"> (URL's Only) </small> <span id="text" class="optional"> </span></label>
</div>
<!-- best project url -->
</div>
<br>
</div>
</div>
<!-- clone items inputs/textareas/files end-->
<br>
<button class="addAnswer btn btn-info" href="#"><i class="fa fa-plus"></i> Add Child</button>
</div>
<!-- parent that clones end-->
</div>
<!-- parent container end -->
<br>
<button id="addQuestion" class="btn btn-success" href="#"> <i class="fa fa-plus"></i> Add Parent </button>
Some of your objects were too ambigous, so things were not going to work as you expected.
Consider the following example.
$(function() {
function updateName(i, n) {
i = $(i);
var o = i.attr("name");
if (n != undefined) {
i.attr("name", o.replace(/\[(\d+)\]/, '[' + n + ']'));
} else {
i.attr("name", o.replace(/\[(\d+)\]$/,
function(str, p1) {
return '[' + (parseInt(p1, 10) + 1) + ']';
}));
}
return true;
}
function makeDel(cnt, pClass, tObj) {
return $("<button>", {
class: pClass + " btn btn-danger",
type: "button"
}).html(cnt).insertAfter(tObj);
}
function addQuestion(event) {
var self = $(event.target);
event.preventDefault();
var newValue = $(".question").length + 1;
var newQ = $(".question").eq(0).clone(true);
$("input, textarea", newQ).each(function() {
updateName(this, newValue);
});
newQ.appendTo("#questioncontainer");
var newD = makeDel("Remove Parent Clone", "addQuestion_delete", newQ);
newD.click(function(e) {
e.preventDefault();
newQ.remove();
$(this).remove();
});
}
function addAnswer(event) {
var self = $(event.target);
event.preventDefault();
var group = self.parent().find(".answerContainer");
var newA = $(".answer:last", group).clone(true);
$("input, textarea", newA).each(function() {
updateName(this);
});
newA.appendTo(group);
var newD = makeDel("<i class='fa fa-minus'></i> Remove Child clone", "addAnswer_delete", group);
newD.click(function(e) {
e.preventDefault();
newA.remove();
$(this).remove();
});
}
$("body").on("click", "#addQuestion", addQuestion);
$('body').on('click', '.addAnswer', addAnswer);
});
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!-- parent container -->
<div id="questioncontainer">
<!-- parent that clones -->
<div style="border:1px solid black; width:400px; padding:20px; margin-bottom:10px;" class="question border p-5 mt-3 shadow">
<!-- clone items inputs/textareas/files -->
<div class="row">
<div class="col-lg-6">
<!-- Educational Institute -->
<input oninput="checkCompany()" id="company" name="employer[1]" type="text" class="input-form track track_exp_qua" data-score=20>
<span class="bar"></span>
<label class="input-label"> Company <span id="text" class="required"> </span></label>
<!-- Educational Institute -->
<p class="validate text-danger pt-2" id="company_error"></p>
</div>
<div class="col-lg-6">
<!-- Job title -->
<input oninput="checkJobTitle()" id="job_title" name="job_title[1]" type="text" class="input-form track track_exp_qua" data-score=10>
<span class="bar"></span>
<label class="input-label"> Job Title <span id="text" class="required"> </span></label>
<!-- Job title -->
<p class="validate text-danger pt-2" id="job_title_error"></p>
</div>
</div>
<div class="justify-content-center pb-4">
<h4>Below is the child clone</h4>
</div>
<!-- child container -->
<div style="border:1px solid red; padding:20px;" class="answerContainer">
<div class="answer">
<div class="row">
<!-- best project url -->
<div class="col-lg-6">
<input name="best_project[1][1]" type="text" class="input-form track track_exp_qua" data-score=10>
<span class="bar"></span>
<label class="input-label">Best Project<small style="color:#FFBF00;"> (URL's Only) </small> <span id="text" class="optional"> </span></label>
</div>
<!-- best project url -->
</div>
<br>
</div>
</div>
<!-- clone items inputs/textareas/files end-->
<br>
<button class="addAnswer btn btn-info" href="#"><i class="fa fa-plus"></i> Add Child</button>
</div>
<!-- parent that clones end-->
</div>
<!-- parent container end -->
<br>
<button id="addQuestion" class="btn btn-success" href="#"> <i class="fa fa-plus"></i> Add Parent </button>
Objects are created and referenced a bit better, so it's easier to manipulate them and remove them as needed. Anytime you are doing the same thing multiple times, you could consider creating a function for it.

Create a razor view dynamically for below database rows

for BELOW table TechCourse contains courseName image and price I need to display these details dynamically using BELOW CShtml code. for each course, that above div code should display dynamically.
+------------+-----------+---------------------+-------------+--+
| | | | | |
| Course_ID | Name | imageurl | courseprize | |
| 100 | Physics | /images/physics.jpg | 750 | |
| 101 | Maths | /images/maths.jpg | 800 | |
| 102 | Biology | /images/bio.jpg | 800 | |
| 103 | Chemistry | images/chem.jpg | NULL | |
+------------+-----------+---------------------+-------------+--+
Div Code:
<section class="popular-posts-block container">
<header class="popular-posts-head">
<h2 class="popular-head-heading">Most Popular Courses</h2>
</header>
<div class="row">
<div class="slider popular-posts-slider">
#foreach (var TechCourse in Model)
{
<div>
<div class="col-xs-12">
<!-- popular post -->
<article class="popular-post">
<div class="aligncenter">
<img src
Here Course Image
alt="image description">
</div>
<div>
<strong class="bg-primary text-white font-lato text-uppercase price-tag">$99.00</strong>
</div>
<h3 class="post-heading">CourseName</h3>
<div class="post-author">
<div class="alignleft rounded-circle no-shrink">
<a href="instructor-single.html">
Here Image
<img src="http://placehold.it/35x35" class="rounded-circle" alt="image description"></a>
</div>
<h4 class="author-heading">Arfat</h4>
</div>
<footer class="post-foot gutter-reset">
<ul class="list-unstyled post-statuses-list">
<li>
<a href="#">
<span class="fas icn fa-users no-shrink"><span class="sr-only">users</span></span>
<strong class="text fw-normal">98</strong>
</a>
</li>
<li>
<a href="#">
<span class="fas icn no-shrink fa-comments"><span class="sr-only">comments</span></span>
<strong class="text fw-normal">10</strong>
</a>
</li>
</ul>
<ul class="star-rating list-unstyled">
<li><span class="fas fa-star"><span class="sr-only">star</span></span></li>
<li><span class="fas fa-star"><span class="sr-only">star</span></span></li>
<li><span class="fas fa-star"><span class="sr-only">star</span></span></li>
<li><span class="fas fa-star"><span class="sr-only">star</span></span></li>
<li><span class="fas fa-star"><span class="sr-only">star</span></span></li>
</ul>
</footer>
</article>
</div>
</div>
}
</div>
</div>
</section>
for the above table, TechCourse contains courseName image and price I need to display these details dynamically using above cshtml code. for each course, that above div code should display dynamically.
Use the code below:
public ActionResult Index()
{
var coursetab = (from list in dbcontext.Course_master orderby list.CreatedDate descending where list.Course_ID != 0 select list).ToList();
return View(coursetab);
}
ViewCode:
<section class="popular-posts-block container">
<header class="popular-posts-head">
<h2 class="popular-head-heading">Most Popular Courses</h2>
</header>
<div class="row">
<!-- popular posts slider -->
<div class="slider popular-posts-slider">
#foreach (var item in Model)
{
<div>
<div class="col-xs-12">
<!-- popular post -->
<article class="popular-post">
<div class="aligncenter">
<img src="~/Images/CourseImages/#item.Imageurl" style="height:147px;" />
</div>
<div>
<strong class="bg-primary text-white font-lato text-uppercase price-tag"></strong>
</div>
<h3 class="post-heading">#item.Name</h3>
<div class="post-author">
<div class="alignleft no-shrink rounded-circle">
<img src="http://placehold.it/35x35" class="rounded-circle" alt="image description">
</div>
<h4 class="author-heading">Arfat</h4>
</div>
</article>
</div>
</div>
}
</div>
</div>
</section>

jquery / Ajax "undefined" error

i am trying to get an image uploader working inside my MVC project, but everytime i click the upload file button, i get "Error undefined", i am not sure where i am going wrong.
The page is a partial view, loaded inside a #Html.BeginForm . below is the code i am using.
Index.cshtml
#using (Html.BeginForm("Register", "Account", FormMethod.Post))
{
#Html.AntiForgeryToken()
<div class="container">
<div class="row">
<article class="col-sm-12 col-md-12 col-lg-12 sortable-grid ui-sortable">
<div id="wid-id-0">
<!-- widget div-->
<div role="content">
<!-- widget content -->
<div class="widget-body">
<div class="row" style="background: white">
<form id="wizard-1" novalidate="novalidate">
<div id="bootstrap-wizard-1" class="col-sm-12">
<div class="tab-content">
#*Tab 1 (Step 1)*#
<div class="tab-pane active" id="tab1">
<br>
#Html.Partial("Registration/_Step1")
<div class="form-actions">
<div class="row">
<div class="col-sm-12">
<ul class="pager wizard no-margin">
<li class="previous disabled">
Previous
</li>
<li data-target="#step2" class="next">
Next
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="form-bootstrapWizard">
<ul class="bootstrapWizard form-wizard" style="background: coral">
<li class="active" data-target="#step1">
<span class="step">1</span> <span class="title">Step 1: Profile Information</span>
</li>
<li data-target="#step2" class="">
<span class="step">2</span> <span class="title">Step 2: Profile Picture</span>
</li>
<li data-target="#step3" class="">
<span class="step">3</span> <span class="title">Step 3: Identification</span>
</li>
<li data-target="#step4">
<span class="step">4</span> <span class="title">Step 4: Submit Profile</span>
</li>
</ul>
<div class="clearfix"></div>
</div>
</div>
</form>
</div>
</div>
<!-- end widget content -->
</div>
<!-- end widget div -->
</div>
<!-- end widget -->
</article>
</div>
</div>
}
_Step1.cshtml
<script src="https://code.jquery.com/jquery-1.12.4.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script>
$(document).ready(function () {
$("#Upload").click(function (e) {
e.preventDefault();
var formData = new FormData();
var totalFiles = document.getElementById("FileUpload").files.length;
for (var i = 0; i < totalFiles; i++)
{
var file = document.getElementById("FileUpload").files[i];
formData.append("FileUpload", file);
}
$.ajax({
type: "POST",
url: '#Url.Action("UploadFiles", "Account")',
data: formData,
dataType: 'json',
contentType: false,
processData: false,
success: function (response) {
alert('succes!!');
},
error: function (error) {
alert("error: " + error.statusMessage);
}
});
});
});
</script>
<table align="center">
<tr>
<td style="text-align: center;"><label>Upload Profile Picture</label></td>
<td></td>
</tr>
<tr>
<td valign="top"><img id="imgPreview" src="~/Content/Images/upload_holder.PNG" class="img-holder" style="width: 180px; height: 180px;" /></td>
<td>
#*<input type="submit" class="btn btn-lg" style="width: 200px; background: #0091d9; color: white;" value="Upload Photo" />*#
#*<input id="input-4" name="input4[]" type="file" multiple class="file-loading" style="width: 200px; background: #0091d9; color: white;" value="Upload Photo">*#
<input type="file" id="FileUpload" multiple />
<input type="submit" id="Upload" value="Upload"/>
<br />
<br />
<label>Acceptable file formats: jpg, gif or png file</label>
<br />
<label>Under 1 MB</label>
</td>
</tr>
</table>
any help is greatly appreciated!
EdIT: Below is the controller function, but its never hit.
[HttpPost]
public ActionResult UploadFiles()
{
// Checking no of files injected in Request object
if (Request.Files.Count > 0)
{
try
{
// Get all files from Request object
HttpFileCollectionBase files = Request.Files;
for (int i = 0; i < files.Count; i++)
{
//string path = AppDomain.CurrentDomain.BaseDirectory + "Uploads/";
//string filename = Path.GetFileName(Request.Files[i].FileName);
HttpPostedFileBase file = files[i];
string fname;
// Checking for Internet Explorer
if (Request.Browser.Browser.ToUpper() == "IE" || Request.Browser.Browser.ToUpper() == "INTERNETEXPLORER")
{
string[] testfiles = file.FileName.Split(new char[] { '\\' });
fname = testfiles[testfiles.Length - 1];
}
else
{
fname = file.FileName;
}
// Get the complete folder path and store the file inside it.
fname = Path.Combine(Server.MapPath("~/Uploads/"), fname);
file.SaveAs(fname);
}
// Returns message that successfully uploaded
return Json("File Uploaded Successfully!");
}
catch (Exception ex)
{
return Json("Error occurred. Error details: " + ex.Message);
}
}
else
{
return Json("No files selected.");
}
}

Meteor only trigger template after selecting item from list

I have a typical scenario where there is a list view and then there's a details view. You get to the details view by selecting a list item. There's data in the record that of course will inform the layout view of the details. What I see is that the subtemplate's helper function is being called too soon (during the list view rendering) to have the data for the list details . Furthermore, it's not being called when I click an item in the list. What am I doing wrong? I'm using Meteor 0.8.2 with jQM 1.4.3.
The HTML looks as follows:
<!-- details page -->
<div data-role="page" data-theme="q" id="listdetail">
<div data-role="header" data-position="fixed">
<a data-rel="back" href="#" data-transition="slideleft" class="baack fa fa-arrow-left"></a>
<div id="detailTitle" class="headertitle"></div>
</div>
<!-- /header -->
<div data-role="content" class="ma-req-detail" id="details">
{{> qDetails}}
</div>
</div>
<!-- /details page -->
<template name="qList">
{{#each items}}
{{>qListItems}}
{{/each}}
</template>
<template name="qListItems">
<li>
<div id="msg-container-{{requestId}}" class="processing-msg">
<i class="fa fa-2x fa-times-circle"></i>
<p class="msg-text-{{requestId}}">Action pending...</p>
</div>
<a id="requestId" href="#listdetail" data-name="{{additionalProperties}}" data-transition="slide" class="{{#if isProcessing}}ui-disabled{{/if}}">
<p class="requestor">{{additionalProperties.requestedForUid}}</p>
<p class="description">week of {{additionalProperties.workWeekOf}}</p>
<p class="reqdate">total hours: </p>
</a>
</li>
</template>
<template name="qDetails" >
<div role="main" class="q-details">
<div data-role="navbar" class="week-nav">
<ul>
{{#each days}}
{{>navElements}}
{{/each}}
</ul>
</div>
</div>
<div class="ma-buttons ui-fieldcontain ui-footer-fixed">
<div data-role="controlgroup" data-type="horizontal" class="" data-position-fixed="true" data-position="bottom">
<a data-mini="true" href="#" id="approve-request"
class="ui-btn ui-btn-c ui-corner-r ui-icon-check ui-btn-icon-left ma-btn approve">Approve</a>
</div>
</div>
</template>
<template name="navElements">
<li><a id="{{day}}Nav" href="#{{day}}">{{day}}<br><span class="digital-date">{{date}}</span></a></li>
</template>
The JS bits are:
Template.qDetails.rendered = function() {
$('#details').trigger('create');
};
Template.qDetails.helpers({
days: function() {
//TODO need a way to delay this function to call when details template is shown
var dt = Session.get("record").additionalProperties.workWeekOf;
var days = [];
var weekday = new Array(7);
weekday[0] = "SAT";
weekday[1] = "SUN";
weekday[2] = "MON";
weekday[3] = "TUE";
weekday[4] = "WED";
weekday[5] = "THU";
weekday[6] = "FRI";
var dtVal = dt.getDate();
for (var i = 0; i < 7; i++) {
var dayObj = {};
dayObj.date = dtVal + i;
dayObj.day = weekday[i];
days.push(dayObj);
}
return days;
}
});
Template.qDetails.record = function () {
return Session.get("record");
};
In the code above the "days" helper function is being called when the list page is shown which results in an error because it is trying to pull the "workWeekOf" date from a record that hasn't been selected yet. How can I get to this only call once a record has been selected?
This is slightly confusing, since there's nothing in the above that shows how yourqDetails template gets rendered in the first place. However, assuming it does, you can just use:
var dt = Session.get("record") ? Session.get("record").additionalProperties.workWeekOf : [default date]
[default date] could be anything sensible (like new Date()), but you need to return something to avoid the error being thrown. This is a pretty common but very easily solved problem in Meteor - you just need a suitable default for when your Session variable or Collection isn't yet ready.

Bootstrap : accordion-toggle doesn't work

I have a problem with my accodion-toggle . I put it in my code but it doesn't work my title stay in blue and with nothing near of my title.
This is my code :
#{string module_origine = "";
int step = 0;
}
<div class="accordion" id="accordion2">
#foreach (var test in Model)
{
if (module_origine != test.module)
{
module_origine = test.module;
step = step + 1;
<div class="accordion-group">
<div class="accordion-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapse_#step">
#Html.DisplayFor(ModelItem => test.module)
</a>
</div>
<div id="Collapse_#step" class="accordion-body collapse in">
<div class="accordion-inner ">
#foreach (var item in Model.Where(item => item.module == module_origine))
{
<form method="get" action="/#Html.DisplayFor(modelItem =>item.droit)">
<button type="submit" class="btn btn-primary" title="#Html.DisplayFor(ModelItem => item.description)">#Html.DisplayFor(modelItem => item.menunom)</button>
</form>
}
</div>
</div>
</div>
}
}
</div>
I don't understand why my class accordion-toggle doesn't work so I hope I can understand why and help me think you !
to get a panel it's easy just change that :
#{string module_origine = "";
int step = 0;
}
**<div class="panel-group" id="accordion">** //add that to create panel
#foreach (var test in Model)
{
if (module_origine != test.module)
{
module_origine = test.module;
step = step + 1;
<div class="panel panel-success ">
<div class="panel-heading">
<a class="accordion-toggle" data-toggle="collapse" data-parent="#accordion2" href="#collapse_#step">
#Html.DisplayFor(ModelItem => test.module)
</a>
</div>
<div id="Collapse_#step" class="accordion-body collapse in">
<div class="accordion-inner ">
#foreach (var item in Model.Where(item => item.module == module_origine))
{
<form method="get" action="/#Html.DisplayFor(modelItem =>item.droit)">
<button type="submit" class="btn btn-primary" title="#Html.DisplayFor(ModelItem => item.description)">#Html.DisplayFor(modelItem => item.menunom)</button>
</form>
}
</div>
</div>
</div>
}
}
</div>
I just remove the accordion content it's not wooking on my thing

Resources