@ismcagdas - Thank you!! That worked!!
One note for others that use the solution above, you do need to run the command "npm run create-bundles" after making the changes mentioned in the prior post.
Can you please tell me how I can change the look of the spinner used? I would like to use a different spinner with some text as well. I really like the one you have used on your demo portal of AspNetZero web site.
Update: I was just testing some more and when using the below code. The clearBusy is NOT working. The spinner just stays there.
if (!_$Form.valid()) {
return;
}
abp.ui.setBusy('#tabDetails');
var legalEntity = _$Form.serializeFormToObject();
_legalEntitysService.updateLegalEntity(
legalEntity
).done(function () {
abp.ui.clearBusy();
abp.notify.info(app.localize('SavedSuccessfully'));
abp.event.trigger('app.editLegalEntityModalSaved');
});
I did the rebudle option on the app-lib-layout file as you suggested. Still the same issue persists and the same error is getting logged in the console.
The minus sign just indicates that files are not in Git Repo. Both files are physically present on my PC.
Do you want me to run the minify?
Files are present. I have run the npm create bundles command a few times.
@ryancyq - Can you please provide a solution on this issue. I cannot seem to get BlockUI working on any page. I found this code in the app-layout-libs.js, this seems to be the source of the error getting logged in the console. What is this is doing or supposed to do?
` /* UI BUSY */ //Defines UI Busy API, not implements it
abp.ui.setBusy = function (elm, optionsOrPromise) {
abp.log.warn('abp.ui.setBusy is not implemented!');
};`
On on my index page, I called blockUI using this code.
abp.ui.setBusy('.m-subheader .m-content');
But still I don't get any blocking and the error is getting logged in the console?
I checked my app-layout-libs.js bundle settings with your GIT repo version and its the same. I dont see anything missing? Can you share the code from the demo portal on how the blockUI is created with spinner?
In my chrome console I am seeing these messages logged.
WARN: app-layout-libs.js?v=sm6yeTqKaPg7WdH6tGylsDxoL7C6xzVP9-q2szCogzk:77095 abp.ui.clearBusy is not implemented! app-layout-libs.js?v=sm6yeTqKaPg7WdH6tGylsDxoL7C6xzVP9-q2szCogzk:77095 WARN: app-layout-libs.js?v=sm6yeTqKaPg7WdH6tGylsDxoL7C6xzVP9-q2szCogzk:77095 abp.ui.setBusy is not implemented! app-layout-libs.js?v=sm6yeTqKaPg7WdH6tGylsDxoL7C6xzVP9-q2szCogzk:77095 WARN: app-layout-libs.js?v=sm6yeTqKaPg7WdH6tGylsDxoL7C6xzVP9-q2szCogzk:77095 abp.ui.clearBusy is not implemented!
Is this the reason its not working, if yes, what do I need to do to enable full blockUI functionality?
I did some more digging into this issue and found a Stackoverflow thread that helped. I changed the mapping, as shown below. I reveresed the source and destination values and used ForMember instead. This resolved my error.
configuration.CreateMap<LegalEntity, EditLegalEntityDto> ()
.ForMember(dto => dto.NewNote, opt => opt.Ignore());
However, I would like to understand why the original code did not work? If anyone has any ideas, please do share.
@jtallon - I dont know Angular sorry. I only work on MVC JQuery project. However, I would assume it should be faily simple. Here is example cshtml markup from one of my "Edit" pages. Hope this helps?
<div class="m-subheader" id="IndexView">
<div class="row align-items-center">
<div class="mr-auto col-sm-12 col-md-6">
<h3 class="m-subheader__title m-subheader__title--separator">
<span>@L("YourPageHeading")</span>
</h3>
<span class="m-section__sub">
@L("YourPageHeaderInfo")
</span>
</div>
</div>
</div>
<div class="m-content">
<div class="m-portlet m-portlet--tabs m-portlet--primary m-portlet--head-solid-bg m-portlet--head-sm">
<div class="m-portlet__head">
<div class="m-portlet__head-caption">
<div class="m-portlet__head-title">
<h3 class="m-portlet__head-text">
@Model.NameProperty
</h3>
</div>
</div>
<div class="m-portlet__head-tools">
<ul class="nav nav-tabs m-tabs m-tabs-line m-tabs-line--right" role="tablist">
<li class="nav-item m-tabs__item">
<a class="nav-link m-tabs__link active show" data-toggle="tab" href="#tabDetails" role="tab" aria-selected="true">
Tab1
</a>
</li>
<li class="nav-item m-tabs__item">
<a class="nav-link m-tabs__link" data-toggle="tab" href="#tabAddress" role="tab" aria-selected="false">
Tab2
</a>
</li>
<li class="nav-item m-tabs__item">
<a class="nav-link m-tabs__link" data-toggle="tab" href="#tabContact" role="tab" aria-selected="false">
Tab3
</a>
</li>
<li class="nav-item m-tabs__item">
<a class="nav-link m-tabs__link" data-toggle="tab" href="#tabNotes" role="tab" aria-selected="false">
Tab4
</a>
</li>
</ul>
</div>
</div>
<div class="m-portlet__body">
<div class="tab-content">
<div class="tab-pane active show" id="tabDetails" role="tabpanel">
Tab1 content
</div>
<div class="tab-pane" id="tabAddress" role="tabpanel">
Tab2 content
</div>
<div class="tab-pane" id="tabContact" role="tabpanel">
Tab3 content
</div>
<div class="tab-pane" id="tabNotes" role="tabpanel">
Tab4 content
</div>
</div>
</div>
<div class="m-portlet__foot">
<div class="m-stack m-stack--ver m-stack--general">
<div class="m-stack__item m-stack__item--center">
<a class="btn btn-outline-metal m-btn m-btn--icon m-btn--pill m-btn--air" href="@Url.Action("Index", "YourControllerName")">
<span>
<i class="fa fa-backward"></i>
<span>@L("GoBack")</span>
</span>
</a>
</div>
</div>
</div>
</div>
@jtallon - I have done this quite a lot in my AspNetZero app. I usually just take the Index.cshtml page and copy it and then replace all of the "content" section below the page heading and page heading info.