Using Modal in Blazor - modal-dialog

I have a modal that have two buttons "Delete and Cancel".
When i click on the Delete-button this code below will execute.
<BSModal #ref="ConfDelete">
<BSModalHeader OnClick="#(() => ConfDelete.Hide())">Uppdragsnummer:#report.AssignmentNumber</BSModalHeader>
<BSModalBody><p>Vill du verkligen radera??</p></BSModalBody>
<BSModalFooter>
<BSButton Color="Color.Secondary" #onclick="#(() => Cancel())">Ă…ngra</BSButton>
<BSButton Color="Color.Danger" #onclick="#(() => DeleteReport())">Tabort</BSButton>
</BSModalFooter>
</BSModal>
#code {
BSModal ConfDelete;
public void DeleteReport()
{
imanager.Delete(report);
navigationManager.NavigateTo("/");
}
}
When i come back to the page where all the
reports are listed. And click on a other report and go there.
I can not scroll on that page. But, if i refresh the site "manually" i can scroll.
How can i solve this in the code?
What have i missed?

Related

ionic 4 deal with modal when users click phone back button

What should happen when users click over back button of phone? In case when modal opens.
Registered a back button:
// To prevent interference with ionic's own backbutton handling
// you can subscribe with a low priority instead
this.platform.backButton.subscribe(() => {
// code that is executed when the user pressed the back button
// and ionic doesn't already know what to do (close modals etc...)
self.modalController.dismiss();
});
The problem with the code:
It closes/dismiss modal is fine!
But it also pushed back the page from where the modal is opened. Means it pop the page behind modal.
This should not happen the page should not pop - only modal should close.
Check the image gif added ->
Click here to see the problem
You may consider using platform.backButton.subscribeWithPriority() with a high priority (ex: 9999).
Then checking if there is a opened modal with modalController.getTop().
constructor(private modalCtrl: ModalController, private nav: NavController) {
}
ngOnInit() {
this.platform.backButton.subscribeWithPriority(9999, () => {
this.closeModalOrPage();
});
}
async closeModalOrPage(){
let modal = await this.modalCtrl.getTop();
if (modal){
modal.dismiss();
} else {
this.nav.pop();
}
}

Ionic Tab not move to its position after back from single page

this is Ionic version 1 question:
i have 4 tabs, each of the tab have it's content, one of them have a list inside it...
so if we have a list inside 3rd tab, then we choose the list and go to single page with back button...
after i tab the back button, it back to 1st tab, not to 3rd tab...
it seems that it cannot remember the position by default, i have tried some workaround like this...
i set the tab just before it enter the previous page:
$scope.$on("$ionicView.beforeEnter", function (event, data) {
$ionicTabsDelegate.select($scope.maintabindex);
});
with this on-select on each tab:
<ion-tab title="Forum" icon-on="ion-tab-fa-headphones" icon-off="ion-tab-fa-headphones" on-select="tabSelected()" href="#/app/home">
and then i have this function:
$scope.tabSelected = function () {
$scope.maintabindex = $ionicTabsDelegate.selectedIndex();
};
the problem is, the on-select method executed after i back to the parent page (*with tab page), so it cannot working well, because $ionicTabsDelegate.selectedIndex() on-select always give 0 index after i back from the single page to the tabbed page
any idea?
The ionic go back button should work in those scenarios, be sure that the child's view route is using the same ui-view as the parent tab. If that is the case and it is still not working, it's better for you to override the backbutton on the childs view to go to the parent.
Like this:
<ion-nav-bar ng-controller="MyCtrl">
<ion-nav-back-button class="button-clear"
ng-click="myGoBack()">
<i class="ion-arrow-left-c"></i> Back
</ion-nav-back-button>
</ion-nav-bar>
function MyCtrl($scope, $ionicHistory) {
$scope.myGoBack = function() {
$ionicHistory.goBack();
};
}
You can even replace the myGoBack() function with $state.go('parent-tab-view')

TabControl avoid changing to another tab

I have a tab control with 2 tabs.. When the user clicks on the second tab, it does some validation and then if that validation returns false, the user gets a message indicating to go back. Now, here's my problem, it changes tabs anyways with the code below:
Although the user doesn't see the tab 2, it is showing as changed.
private void tabprincipal_SelectedIndexChanged(object sender, EventArgs e)
{
if (!saved_plan)
{
MessageBox.Show("You need to save a plan first.");
return;
}
How can I avoid this behavior? I want to display the message and the user to remain in the first tab
I think I'm looking for an event prior to the selectedindexchanged to detect that the user clicked tab2 and then don't let him move..
I actually found a way using the Deselecting method of the TabControl
private void tabprincipal_Deselecting(object sender, TabControlCancelEventArgs e)
{
if (!saved_plan)
{
MessageBox.Show("You need to save a plan first");
e.Cancel = true;
}
}

ui.tabs add callback not able to set tab

I am trying to get jQuery tabs to behave like IE and Firefox. I have a few tabs with an "addtab" at the end. When this tab is clicked a new tab is added, this is fine. But i want to select the second last tab. This is proving to be quite difficult.
my init code is
$tabs =$("#tabs").tabs({
add: function(event, ui) {
$tabs.tabs('select', $tabs.tabs( 'length' ) -2);
alert ("after setting tab");
}
});
my add tab code is
$("#addtab").click(function(){
showcal();
// The first thing to do is to deselect all the other selections
$("#tabs .ui-corner-top").each (function () {
$(this).removeClass ("ui-tabs-selected ui-state-active").addClass ("ui-state-default");
});
$tabs.tabs('add','#extra','Generate Report', ($tabs.tabs('length')-1));
tabContainerTabCount++;
});
however in the add callback the following line is resetting the selected tab
self._trigger('select', null, self._ui(this, $show[0])) === false)
If anyone has any solution or reason why this is done, can you let me know
Thanks
John
I was pointed to the answer at the following web page
http://forum.jquery.com/topic/ui-tabs-unable-to-set-index-after-add#14737000000698077
thanks tsukasa1989

Ajax Modal Popup Display Issue

On the web page, there is gridview control contains product ID's. bind to a link button.
On ItemCommand event of gridview, I fetch the product information and display in the ajax modal popup extender control. The popup is programatically show on ItemCommand of gridview and also hide programatically.
Now the problem is that, when i close popup after showing first product details and try to see next 1 by clicking on other product ID.., sometimes details are displaye dand sometimes not.
The data comes from database is fetched as well for each product.
Plz help.
I do the same but i have no such problem. So i am pasting code here that may b help full to u.
CODE:
protected void GVallusers_RowEditing(object sender, GridViewEditEventArgs e)
{
try
{
GridViewRow gvRow = ((GridView)sender).Rows[e.NewEditIndex];
populatepanel(gvRow);
ModalPopupExtender1.Show();
}
catch (Exception exc)
{
lblinfo.Text = exc.Message;
}
}
public void populatepanel(GridViewRow gvrow)
{
string userid = gvrow.Cells[0].Text;
lblSite.Text=gvrow.Cells[1].Text;
lblemail.Text = gvrow.Cells[3].Text;
}