Quantcast
Channel: Active questions tagged blazor - Stack Overflow
Viewing all articles
Browse latest Browse all 4839

Blazor TypeError: Cannot read property 'removeChild' of null at Object.e [as removeLogicalChild]

$
0
0

I created a component for a dual list box. Everything is fine but when I submit I get an error.

<EditForm Model="Model.Report" class="kt-form" OnValidSubmit="Model.OnSearch"><div class="modal-header"><h5 class="modal-title" id="exampleModalLabel">Edit Columns</h5><button type="button" class="close" data-dismiss="modal" aria-label="Close"></button></div><div class="modal-body"><div class="row"><div class="col-md-12"><Project.Components.DualListbox ReportColumns="Model.Report.ReportColumns" Id="ReportColumns" @bind-Value="@Model.Report.ReportColumns"></Project.Components.DualListbox></div></div></div><div class="modal-footer"><button type="button" class="btn btn-secondary btn-sm" @onclick="Model.OnCloseModal"><i class="la la-close"></i> Close</button><button type="submit" class="btn btn-primary btn-sm"><i class="la la-exchange"></i> Change</button></div></EditForm>

DualListbox Razor code:

@typeparam TValue@inherits InputBase<TValue>@if (ReportColumns != null){<select id="@Id" class="kt-dual-listbox" multiple>        @foreach (var column in ReportColumns.OrderBy(c => c.Sort))        {            if (column.IsChecked == 1)            {<option value="@column.Id" selected>@column.Title</option>            }            else            {<option value="@column.Id">@column.Title</option>            }        }</select>}

*DualListbox code-behind *:

using Project.Models;using Microsoft.AspNetCore.Components;using Microsoft.AspNetCore.Components.Forms;using Microsoft.JSInterop;using System;using System.Collections.Generic;using System.Globalization;using System.Linq;using System.Threading.Tasks;namespace Project.Components{    public partial class DualListbox<TValue> : InputBase<TValue>    {        [Parameter] public string Id { get; set; }        [Inject] IJSRuntime JSRuntime { get; set; }        [Parameter] public ICollection<ReportColumn> ReportColumns { get; set; }        public DotNetObjectReference<DualListbox<TValue>> DotNetRef;        [Parameter] public EventCallback<object> OnChanged { get; set; }        protected override bool TryParseValueFromString(string value, out TValue result, out string validationErrorMessage)        {            try            {                if (value == "null")                {                    value = null;                }                if (typeof(TValue) == typeof(string))                {                    result = (TValue)(object)value;                    validationErrorMessage = null;                    return true;                }                else if (typeof(TValue) == typeof(int) || typeof(TValue) == typeof(int?))                {                    int.TryParse(value, NumberStyles.Integer, CultureInfo.InvariantCulture, out var parsedValue);                    result = (TValue)(object)parsedValue;                    validationErrorMessage = null;                    return true;                }                throw new InvalidOperationException($"{GetType()} does not support the type '{typeof(TValue)}'.");            }            catch (Exception ex)            {                throw ex;            }        }        protected override void OnInitialized()        {            base.OnInitialized();            DotNetRef = DotNetObjectReference.Create(this);        }        protected override async Task OnAfterRenderAsync(bool firstRender)        {            await base.OnAfterRenderAsync(firstRender);            if (firstRender)            {                await JSRuntime.InvokeVoidAsync("dualListboxComponent.init", Id, DotNetRef, "Change_SelectWithFilterBase");            }        }        [JSInvokable("Change_SelectWithFilterBase")]        public void Change(string value)        {            try            {                if (value == "null")                {                    value = null;                }                var array = value.Split("#");                if (array[0] == "add")                {                    int _value = int.Parse(array[1]);                    var report = ReportColumns.Where(c => c.Id == _value).FirstOrDefault();                    report.IsChecked = 1;                }                else                {                    int _value = int.Parse(array[1]);                    var report = ReportColumns.Where(c => c.Id == _value).FirstOrDefault();                    report.IsChecked = 0;                }             }            catch (Exception ex)            {                throw ex;            }            if (OnChanged.HasDelegate)                OnChanged.InvokeAsync(value);        }    }}

[2020-02-12T07:42:28.867Z] Error: There was an error applying batch 7.e.log @ blazor.server.js:15 blazor.server.js:8 Uncaught (in promise)

TypeError: Cannot read property 'insertBefore' of nullat Object.s [as insertLogicalChild] (blazor.server.js:8)at e.insertText (blazor.server.js:8)at e.insertFrame (blazor.server.js:8)at e.applyEdits (blazor.server.js:8)at e.updateComponent (blazor.server.js:8)at Object.t.renderBatch (blazor.server.js:1)at e. (blazor.server.js:15)at blazor.server.js:15at Object.next (blazor.server.js:15)at blazor.server.js:15 blazor.server.js:15 [2020-02-12T07:42:28.926Z] Error: System.AggregateException: One ormore errors occurred. (TypeError: Cannot read property 'insertBefore'of null) ---> System.InvalidOperationException: TypeError: Cannotread property 'insertBefore' of null atMicrosoft.AspNetCore.Components.RenderTree.Renderer.InvokeRenderCompletedCallsAfterUpdateDisplayTask(TaskupdateDisplayTask, Int32[] updatedComponents) --- End of innerexception stack trace ---


Viewing all articles
Browse latest Browse all 4839

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>