Geek asks and answers

Switch between EditorFor and DisplayFor

I have a partial view that is configured as a table / grid showing records from a DB - I can easily make it display my display or editor template for a row, but how can I switch a row from displayForto editorForwhen I click and edit or save a link?

<div id="compQuestionListContainer">
    <div class="divQuestionItems">
        <div class="divQuestionItemsHeaderRow">
            <div class="QuestionHeader">Question Type</div>
            <div class="QuestionHeader question-name">Question Name</div>
            <div class="QuestionHeader question-required">Required</div>
            <div class="QuestionHeader question-group">Question Group</div>
            <div class="QuestionHeader">Modified By</div>
            <div class="QuestionHeader">Modified Date</div>
            <div class="QuestionHeader question-edit">Edit</div>
            <div class="QuestionHeader question-delete">Delete</div>
        </div>
        <div class="divOrderItemsBody">
            @Html.EditorFor(m => m.CompetitionQuestionList)
            @Html.DisplayFor(m => m.CompetitionQuestionList)
        </div>
    </div>
</div>
+3
source share
1 answer

You can do such things in Razor:

@{
   if (someCondition)
   {
      Html.EditorFor(m => m.CompetitionQuestionList);
   }
   else
   {
      Html.DisplayFor(m => m.CompetitionQuestionList);
   }
}

Update

If you are trying to move from one view to another depending on the user's actions, you will have to use a different approach.

For example, you can display both in a view:

<div id="editor" style="display:none;">
    Html.EditorFor(m => m.CompetitionQuestionList)
</div>
<div id="display">
    Html.DisplayFor(m => m.CompetitionQuestionList)
</div>

And then, in your client code (if you download jQuery), you can do:

$("#editor").show();
$("#display").hide();

To switch from the screen to the editor.

+5

More articles:


All Articles