X
Tap here to go to the mobile version of the site.

Support Forum

JSON response overlaid on page instead of delivered to JS

Posted

I am migrating a key piece of code which formerly used XML to return information from a server script to instead use JSON. However the JSON response, instead of being returned by calling the response handler is instead overlaid on top of the page which made the AJAX request. I have attached a screenshot displaying this. The JSON response is encased in <pre>. I know my code is not doing this because there is no occurrence of that string in my code. The JSON itself is valid according to JsonLint. So why is my response handler not being called, and where is this overlay coming from? I am using the code from JavaScript: The Definitive Guide, 5th Edition, by David Flanagan. Copyright 2006 O'Reilly Media, Inc. (ISBN: 0596101996) to send the AJAX request, fixed to invoke JSON.parse instead of the JS interpreter to handle the response. I am running Firefox 67.0.4 on Ubuntu 19.04. { "parms": { "id": 151951, "parentsIdmr": 34307, "idcr": 92754, "idar": 0, "fatherGivenName": "william", "fatherSurname": "cross", "motherGivenName": "elizabeth", "motherSurname": "wright", "treeName": "", "parentCount": 1, "familyCount": 0, "idir": 133074, "Surname": "Cross", "GivenName": "Alice", "Gender": 1, "CPIdcs": 1, "CPRelDad": 1, "CPRelMom": 1, "SealingDate": "", "SealingIdtr": 1, "SealingIder": 0, "EventIder0": 0, "BirthDate": "Abt 1855", "BirthLocation": "Ontario, Canada", "EventPref0": "Y", "EventIdet0": 3, "EventCitType0": 30, "EventOrder0": -2, "EventSD0": -99999999, "EventChanged0": 1, "cmd": "INSERT INTO tblER (`idir`, `idtype`, `idet`, `order`, `eventd`, `eventsd`, `idlrevent`, `desc`, `gedtag`, `eventexclude`, `idar`, `description`, `sentenceoverride`, `qstag`, `rgexclude`, `kind`, `ldstempleready`, `preferred`) VALUES(133074, 0, 3, -2, 100000185500000000, 18550615, 42, , , 0, 1, , , 0, 0, 0, NULL, 1)", "event144021": { "ider": "144021", "idir": "133074", "idtype": 0, "idtypemeans": "Person", "idet": 3, "eventtype": "born", "order": -2, "eventdc": "100000185500000000", "eventd": "about 1855", "eventsd": 18550615, "idlrevent": 42, "eventloc": "Ontario, Canada", "desc": "", "gedtag": "", "eventexclude": "N", "idar": 1, "description": "", "sentenceoverride": "", "qstag": "N", "rgexclude": "N", "kind": 0, "ldstempleready": null, "preferred": 1 } , "EventIder1": 0, "EventDate1": "", "EventLocation1": "", "EventIdet1": 5, "EventCitType1": 30, "EventOrder1": -1, "EventSD1": -99999998, "EventChanged1": 0, "EventIder2": 0, "DeathDate": "", "DeathLocation": "", "EventPref2": "Y", "EventIdet2": 6, "EventCitType2": 30, "EventOrder2": 0, "EventSD2": 99999998, "EventChanged2": 0, "EventIder3": 0, "EventDate3": "", "EventLocation3": "", "EventIdet3": 4, "EventCitType3": 30, "EventOrder3": 1, "EventSD3": 100000000, "EventChanged3": 0, "Private": 0, "NeverMarried": { "0": "0"}, "UserRef": "", "AncestralRef": "", "AncInterest": 0, "DecInterest": 0, "IDMRPref": 0 }, "cmd": "UPDATE tblIR SET `gender`=1, `birthsd`=18550615, `idlrbirth`=1, `deathsd`=-99999999, `private`=0, `nevermarried`=0 WHERE idir=133074", "person": { "id": 151951, "idir": 133074, "fsid": "", "gender": "F", "living": "N", "templetag": "N", "idmrpref": 0, "idmrparents": 0, "idar": 0, "ancinterest": 0, "decinterest": 0, "tag1": "N", "tag2": "N", "tag3": "N", "tag4": "N", "tag5": "N", "tag6": "N", "tag7": "N", "tag8": "N", "tag9": "N", "taggroup": "N", "taganc": "N", "tagdec": "N", "savetag": "N", "srchtag": "N", "srchtagigi": "N", "srchtagrg": "N", "srchtagfs": "N", "qstag": "N", "remindertag": "N", "remindertagdeath": "N", "treenum": "N", "ltmp1": 0, "ltmp2": 0, "alreadyused": "N", "userref": "", "ancestralref": "", "notes": "", "references": "", "medical": "", "deathcause": "", "ppcheck": "N", "imported": "N", "added": "20190630", "addedtime": "16:35", "updated": "20190630", "updatedtime": "16:35", "relations": "", "nevermarried": "N", "directline": "N", "stmp1": "", "colortag": 0, "intellishare": "", "private": "N", "ppexclude": "", "rgexclude": 0, "dna": "", "fssync": "N", "fsdups": "N", "fsordinance": "N", "fslinks": "", "names": {"359759":{ "idnx": 359759, "idir": 133074, "order": 0, "means": "Primary Name", "prefix": "", "title": "", "surname": "Cross", "givenname": "", "userref": "", "akanote": "", "preferredaka": 0, "treename": "" } } , "events": {"count": 4, "birth": { "ider": "144021", "idir": "133074", "idtype": 0, "idtypemeans": "Person", "idet": 3, "eventtype": "born", "order": -2, "eventdc": "100000185500000000", "eventd": "about 1855", "eventsd": 18550615, "idlrevent": 42, "eventloc": "Ontario, Canada", "desc": "", "gedtag": "", "eventexclude": "N", "idar": 1, "description": "", "sentenceoverride": "", "qstag": "N", "rgexclude": "N", "kind": 0, "ldstempleready": null, "preferred": 1 } ,"death": { "ider": 0, "idir": 133074, "idtype": 0, "idtypemeans": "Person", "idet": 6, "eventtype": "died", "order": "0", "eventdc": "", "eventd": "", "eventsd": -99999999, "idlrevent": null, "eventloc": "Lost Location 0", "desc": "", "gedtag": "", "eventexclude": "N", "idar": 1, "description": "", "sentenceoverride": "", "qstag": "N", "rgexclude": "N", "kind": 0, "ldstempleready": null, "preferred": 1 } } } , "childcmd0": "", "child0": { "idcr": "92754", "idmr": "34307", "family": "William Cross and Elizabeth Wright", "idir": "133074", "child": "Cross (about 1855—)", "order": "0", "prefchild": "N", "idcs": "1", "idcpdad": "1", "idcpmom": "1", "cpdadprivate": "N", "cpmomprivate": "N", "parsealdc": "", "parseald": "", "parsealsd": "-99999999", "idtrparseal": "1", "parsealloc": "", "parsealnote": "", "ldsp": "N", "templetag": "N" } }

I am migrating a key piece of code which formerly used XML to return information from a server script to instead use JSON. However the JSON response, instead of being returned by calling the response handler is instead overlaid on top of the page which made the AJAX request. I have attached a screenshot displaying this. The JSON response is encased in &lt;pre&gt;. I know my code is not doing this because there is no occurrence of that string in my code. The JSON itself is valid according to JsonLint. So why is my response handler not being called, and where is this overlay coming from? I am using the code from JavaScript: The Definitive Guide, 5th Edition, by David Flanagan. Copyright 2006 O'Reilly Media, Inc. (ISBN: 0596101996) to send the AJAX request, fixed to invoke JSON.parse instead of the JS interpreter to handle the response. I am running Firefox 67.0.4 on Ubuntu 19.04. { "parms": { "id": 151951, "parentsIdmr": 34307, "idcr": 92754, "idar": 0, "fatherGivenName": "william", "fatherSurname": "cross", "motherGivenName": "elizabeth", "motherSurname": "wright", "treeName": "", "parentCount": 1, "familyCount": 0, "idir": 133074, "Surname": "Cross", "GivenName": "Alice", "Gender": 1, "CPIdcs": 1, "CPRelDad": 1, "CPRelMom": 1, "SealingDate": "", "SealingIdtr": 1, "SealingIder": 0, "EventIder0": 0, "BirthDate": "Abt 1855", "BirthLocation": "Ontario, Canada", "EventPref0": "Y", "EventIdet0": 3, "EventCitType0": 30, "EventOrder0": -2, "EventSD0": -99999999, "EventChanged0": 1, "cmd": "INSERT INTO tblER (`idir`, `idtype`, `idet`, `order`, `eventd`, `eventsd`, `idlrevent`, `desc`, `gedtag`, `eventexclude`, `idar`, `description`, `sentenceoverride`, `qstag`, `rgexclude`, `kind`, `ldstempleready`, `preferred`) VALUES(133074, 0, 3, -2, 100000185500000000, 18550615, 42, '', '', 0, 1, '', '', 0, 0, 0, NULL, 1)", "event144021": { "ider": "144021", "idir": "133074", "idtype": 0, "idtypemeans": "Person", "idet": 3, "eventtype": "born", "order": -2, "eventdc": "100000185500000000", "eventd": "about 1855", "eventsd": 18550615, "idlrevent": 42, "eventloc": "Ontario, Canada", "desc": "", "gedtag": "", "eventexclude": "N", "idar": 1, "description": "", "sentenceoverride": "", "qstag": "N", "rgexclude": "N", "kind": 0, "ldstempleready": null, "preferred": 1 } , "EventIder1": 0, "EventDate1": "", "EventLocation1": "", "EventIdet1": 5, "EventCitType1": 30, "EventOrder1": -1, "EventSD1": -99999998, "EventChanged1": 0, "EventIder2": 0, "DeathDate": "", "DeathLocation": "", "EventPref2": "Y", "EventIdet2": 6, "EventCitType2": 30, "EventOrder2": 0, "EventSD2": 99999998, "EventChanged2": 0, "EventIder3": 0, "EventDate3": "", "EventLocation3": "", "EventIdet3": 4, "EventCitType3": 30, "EventOrder3": 1, "EventSD3": 100000000, "EventChanged3": 0, "Private": 0, "NeverMarried": { "0": "0"}, "UserRef": "", "AncestralRef": "", "AncInterest": 0, "DecInterest": 0, "IDMRPref": 0 }, "cmd": "UPDATE tblIR SET `gender`=1, `birthsd`=18550615, `idlrbirth`=1, `deathsd`=-99999999, `private`=0, `nevermarried`=0 WHERE idir=133074", "person": { "id": 151951, "idir": 133074, "fsid": "", "gender": "F", "living": "N", "templetag": "N", "idmrpref": 0, "idmrparents": 0, "idar": 0, "ancinterest": 0, "decinterest": 0, "tag1": "N", "tag2": "N", "tag3": "N", "tag4": "N", "tag5": "N", "tag6": "N", "tag7": "N", "tag8": "N", "tag9": "N", "taggroup": "N", "taganc": "N", "tagdec": "N", "savetag": "N", "srchtag": "N", "srchtagigi": "N", "srchtagrg": "N", "srchtagfs": "N", "qstag": "N", "remindertag": "N", "remindertagdeath": "N", "treenum": "N", "ltmp1": 0, "ltmp2": 0, "alreadyused": "N", "userref": "", "ancestralref": "", "notes": "", "references": "", "medical": "", "deathcause": "", "ppcheck": "N", "imported": "N", "added": "20190630", "addedtime": "16:35", "updated": "20190630", "updatedtime": "16:35", "relations": "", "nevermarried": "N", "directline": "N", "stmp1": "", "colortag": 0, "intellishare": "", "private": "N", "ppexclude": "", "rgexclude": 0, "dna": "", "fssync": "N", "fsdups": "N", "fsordinance": "N", "fslinks": "", "names": {"359759":{ "idnx": 359759, "idir": 133074, "order": 0, "means": "Primary Name", "prefix": "", "title": "", "surname": "Cross", "givenname": "", "userref": "", "akanote": "", "preferredaka": 0, "treename": "" } } , "events": {"count": 4, "birth": { "ider": "144021", "idir": "133074", "idtype": 0, "idtypemeans": "Person", "idet": 3, "eventtype": "born", "order": -2, "eventdc": "100000185500000000", "eventd": "about 1855", "eventsd": 18550615, "idlrevent": 42, "eventloc": "Ontario, Canada", "desc": "", "gedtag": "", "eventexclude": "N", "idar": 1, "description": "", "sentenceoverride": "", "qstag": "N", "rgexclude": "N", "kind": 0, "ldstempleready": null, "preferred": 1 } ,"death": { "ider": 0, "idir": 133074, "idtype": 0, "idtypemeans": "Person", "idet": 6, "eventtype": "died", "order": "0", "eventdc": "", "eventd": "", "eventsd": -99999999, "idlrevent": null, "eventloc": "Lost Location 0", "desc": "", "gedtag": "", "eventexclude": "N", "idar": 1, "description": "", "sentenceoverride": "", "qstag": "N", "rgexclude": "N", "kind": 0, "ldstempleready": null, "preferred": 1 } } } , "childcmd0": "", "child0": { "idcr": "92754", "idmr": "34307", "family": "William Cross and Elizabeth Wright", "idir": "133074", "child": "Cross (about 1855&#8212;)", "order": "0", "prefchild": "N", "idcs": "1", "idcpdad": "1", "idcpmom": "1", "cpdadprivate": "N", "cpmomprivate": "N", "parsealdc": "", "parseald": "", "parsealsd": "-99999999", "idtrparseal": "1", "parsealloc": "", "parsealnote": "", "ldsp": "N", "templetag": "N" } }
Attached screenshots
Quote

Additional System Details

Application

  • Firefox 67.0.4
  • User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:67.0) Gecko/20100101 Firefox/67.0
  • Support URL: https://support.mozilla.org/1/firefox/67.0.4/Linux/en-CA/

Extensions

Javascript

  • incrementalGCEnabled: True

Graphics

  • adapterDescription: Intel Open Source Technology Center -- Mesa DRI Intel(R) UHD Graphics 620 (Kabylake GT2)
  • adapterDeviceID: Mesa DRI Intel(R) UHD Graphics 620 (Kabylake GT2)
  • adapterDrivers:
  • adapterRAM:
  • adapterVendorID: Intel Open Source Technology Center
  • contentUsesTiling: False
  • crashGuards: []
  • driverDate:
  • driverVersion: 3.0 Mesa 19.0.2
  • featureLog: {u'fallbacks': [], u'features': [{u'status': u'blocked', u'description': u'Compositing', u'log': [{u'status': u'blocked', u'message': u'Acceleration blocked by platform', u'type': u'default'}], u'name': u'HW_COMPOSITING'}, {u'status': u'unavailable', u'description': u'OpenGL Compositing', u'log': [{u'status': u'unavailable', u'message': u'Hardware compositing is disabled', u'type': u'default'}], u'name': u'OPENGL_COMPOSITING'}, {u'status': u'unavailable', u'description': u'WebRender', u'log': [{u'status': u'opt-in', u'message': u'WebRender is an opt-in feature', u'type': u'default'}, {u'status': u'unavailable', u'message': u'Hardware compositing is disabled', u'type': u'runtime'}], u'name': u'WEBRENDER'}, {u'status': u'blocked', u'description': u'WebRender qualified', u'log': [{u'status': u'available', u'type': u'default'}, {u'status': u'blocked', u'message': u'No qualified hardware', u'type': u'env'}], u'name': u'WEBRENDER_QUALIFIED'}, {u'status': u'available', u'description': u'Off Main Thread Painting', u'log': [{u'status': u'available', u'type': u'default'}], u'name': u'OMTP'}]}
  • info: {u'ApzWheelInput': 1, u'ApzDragInput': 1, u'ApzKeyboardInput': 1, u'CairoUseXRender': 0, u'ApzAutoscrollInput': 1, u'AzureFallbackCanvasBackend': u'none', u'AzureCanvasBackend': u'skia', u'AzureContentBackend': u'skia'}
  • lowEndMachine: False
  • numAcceleratedWindows: 0
  • numAcceleratedWindowsMessage: {u'key': u''}
  • numTotalWindows: 2
  • offMainThreadPaintEnabled: True
  • offMainThreadPaintWorkerCount: 4
  • targetFrameRate: 60
  • usesTiling: False
  • webgl1DriverExtensions: GL_ARB_multisample GL_EXT_abgr GL_EXT_bgra GL_EXT_blend_color GL_EXT_blend_minmax GL_EXT_blend_subtract GL_EXT_copy_texture GL_EXT_subtexture GL_EXT_texture_object GL_EXT_vertex_array GL_EXT_compiled_vertex_array GL_EXT_texture GL_EXT_texture3D GL_IBM_rasterpos_clip GL_ARB_point_parameters GL_EXT_draw_range_elements GL_EXT_packed_pixels GL_EXT_point_parameters GL_EXT_rescale_normal GL_EXT_separate_specular_color GL_EXT_texture_edge_clamp GL_SGIS_generate_mipmap GL_SGIS_texture_border_clamp GL_SGIS_texture_edge_clamp GL_SGIS_texture_lod GL_ARB_framebuffer_sRGB GL_ARB_multitexture GL_EXT_framebuffer_sRGB GL_IBM_multimode_draw_arrays GL_IBM_texture_mirrored_repeat GL_3DFX_texture_compression_FXT1 GL_ARB_texture_cube_map GL_ARB_texture_env_add GL_ARB_transpose_matrix GL_EXT_blend_func_separate GL_EXT_fog_coord GL_EXT_multi_draw_arrays GL_EXT_secondary_color GL_EXT_texture_env_add GL_EXT_texture_filter_anisotropic GL_EXT_texture_lod_bias GL_INGR_blend_func_separate GL_NV_blend_square GL_NV_light_max_exponent GL_NV_texgen_reflection GL_NV_texture_env_combine4 GL_S3_s3tc GL_SUN_multi_draw_arrays GL_ARB_texture_border_clamp GL_ARB_texture_compression GL_EXT_framebuffer_object GL_EXT_texture_compression_s3tc GL_EXT_texture_env_combine GL_EXT_texture_env_dot3 GL_MESA_window_pos GL_NV_packed_depth_stencil GL_NV_texture_rectangle GL_ARB_depth_texture GL_ARB_occlusion_query GL_ARB_shadow GL_ARB_texture_env_combine GL_ARB_texture_env_crossbar GL_ARB_texture_env_dot3 GL_ARB_texture_mirrored_repeat GL_ARB_window_pos GL_EXT_stencil_two_side GL_EXT_texture_cube_map GL_NV_depth_clamp GL_NV_fog_distance GL_APPLE_packed_pixels GL_ARB_draw_buffers GL_ARB_fragment_program GL_ARB_fragment_shader GL_ARB_shader_objects GL_ARB_vertex_program GL_ARB_vertex_shader GL_ATI_draw_buffers GL_ATI_texture_env_combine3 GL_ATI_texture_float GL_EXT_shadow_funcs GL_EXT_stencil_wrap GL_MESA_pack_invert GL_NV_primitive_restart GL_ARB_depth_clamp GL_ARB_fragment_program_shadow GL_ARB_half_float_pixel GL_ARB_occlusion_query2 GL_ARB_point_sprite GL_ARB_shading_language_100 GL_ARB_sync GL_ARB_texture_non_power_of_two GL_ARB_vertex_buffer_object GL_ATI_blend_equation_separate GL_EXT_blend_equation_separate GL_OES_read_format GL_ARB_color_buffer_float GL_ARB_pixel_buffer_object GL_ARB_texture_compression_rgtc GL_ARB_texture_float GL_ARB_texture_rectangle GL_EXT_packed_float GL_EXT_pixel_buffer_object GL_EXT_texture_compression_dxt1 GL_EXT_texture_compression_rgtc GL_EXT_texture_rectangle GL_EXT_texture_sRGB GL_EXT_texture_shared_exponent GL_ARB_framebuffer_object GL_EXT_framebuffer_blit GL_EXT_framebuffer_multisample GL_EXT_packed_depth_stencil GL_APPLE_object_purgeable GL_ARB_vertex_array_object GL_ATI_separate_stencil GL_EXT_draw_buffers2 GL_EXT_draw_instanced GL_EXT_gpu_program_parameters GL_EXT_texture_array GL_EXT_texture_integer GL_EXT_texture_sRGB_decode GL_EXT_timer_query GL_OES_EGL_image GL_AMD_texture_texture4 GL_ARB_copy_buffer GL_ARB_depth_buffer_float GL_ARB_draw_instanced GL_ARB_half_float_vertex GL_ARB_instanced_arrays GL_ARB_map_buffer_range GL_ARB_texture_rg GL_ARB_texture_swizzle GL_ARB_vertex_array_bgra GL_EXT_texture_swizzle GL_EXT_vertex_array_bgra GL_NV_conditional_render GL_AMD_conservative_depth GL_AMD_depth_clamp_separate GL_AMD_draw_buffers_blend GL_AMD_seamless_cubemap_per_texture GL_AMD_shader_stencil_export GL_ARB_ES2_compatibility GL_ARB_blend_func_extended GL_ARB_debug_output GL_ARB_draw_buffers_blend GL_ARB_draw_elements_base_vertex GL_ARB_explicit_attrib_location GL_ARB_fragment_coord_conventions GL_ARB_provoking_vertex GL_ARB_sample_shading GL_ARB_sampler_objects GL_ARB_seamless_cube_map GL_ARB_shader_stencil_export GL_ARB_shader_texture_lod GL_ARB_texture_cube_map_array GL_ARB_texture_gather GL_ARB_texture_multisample GL_ARB_texture_query_lod GL_ARB_texture_rgb10_a2ui GL_ARB_uniform_buffer_object GL_ARB_vertex_type_2_10_10_10_rev GL_EXT_provoking_vertex GL_EXT_texture_snorm GL_MESA_texture_signed_rgba GL_NV_texture_barrier GL_ARB_draw_indirect GL_ARB_get_program_binary GL_ARB_robustness GL_ARB_separate_shader_objects GL_ARB_shader_bit_encoding GL_ARB_shader_precision GL_ARB_texture_compression_bptc GL_ARB_timer_query GL_ARB_transform_feedback2 GL_ARB_transform_feedback3 GL_AMD_multi_draw_indirect GL_ANGLE_texture_compression_dxt3 GL_ANGLE_texture_compression_dxt5 GL_ARB_compressed_texture_pixel_storage GL_ARB_conservative_depth GL_ARB_internalformat_query GL_ARB_map_buffer_alignment GL_ARB_shader_atomic_counters GL_ARB_shader_image_load_store GL_ARB_shading_language_420pack GL_ARB_shading_language_packing GL_ARB_texture_storage GL_ARB_transform_feedback_instanced GL_EXT_framebuffer_multisample_blit_scaled GL_EXT_transform_feedback GL_AMD_query_buffer_object GL_AMD_shader_trinary_minmax GL_ARB_ES3_compatibility GL_ARB_arrays_of_arrays GL_ARB_clear_buffer_object GL_ARB_compute_shader GL_ARB_copy_image GL_ARB_explicit_uniform_location GL_ARB_fragment_layer_viewport GL_ARB_framebuffer_no_attachments GL_ARB_invalidate_subdata GL_ARB_multi_draw_indirect GL_ARB_program_interface_query GL_ARB_robust_buffer_access_behavior GL_ARB_shader_image_size GL_ARB_shader_storage_buffer_object GL_ARB_stencil_texturing GL_ARB_texture_query_levels GL_ARB_texture_storage_multisample GL_ARB_texture_view GL_ARB_vertex_attrib_binding GL_KHR_debug GL_KHR_robustness GL_KHR_texture_compression_astc_ldr GL_ARB_buffer_storage GL_ARB_clear_texture GL_ARB_indirect_parameters GL_ARB_internalformat_query2 GL_ARB_multi_bind GL_ARB_query_buffer_object GL_ARB_seamless_cubemap_per_texture GL_ARB_shader_draw_parameters GL_ARB_shader_group_vote GL_ARB_texture_mirror_clamp_to_edge GL_ARB_texture_stencil8 GL_ARB_vertex_type_10f_11f_11f_rev GL_EXT_shader_framebuffer_fetch GL_EXT_shader_integer_mix GL_INTEL_performance_query GL_ARB_ES3_1_compatibility GL_ARB_clip_control GL_ARB_conditional_render_inverted GL_ARB_cull_distance GL_ARB_derivative_control GL_ARB_get_texture_sub_image GL_ARB_pipeline_statistics_query GL_ARB_shader_texture_image_samples GL_ARB_texture_barrier GL_ARB_transform_feedback_overflow_query GL_EXT_polygon_offset_clamp GL_KHR_blend_equation_advanced GL_KHR_blend_equation_advanced_coherent GL_KHR_context_flush_control GL_KHR_robust_buffer_access_behavior GL_ARB_fragment_shader_interlock GL_ARB_post_depth_coverage GL_ARB_shader_atomic_counter_ops GL_ARB_shader_ballot GL_ARB_shader_clock GL_EXT_shader_samples_identical GL_KHR_no_error GL_KHR_texture_compression_astc_sliced_3d GL_NV_fragment_shader_interlock GL_MESA_shader_integer_functions GL_ARB_polygon_offset_clamp GL_ARB_texture_filter_anisotropic GL_EXT_shader_framebuffer_fetch_non_coherent GL_INTEL_shader_atomic_float_minmax
  • webgl1Extensions: ANGLE_instanced_arrays EXT_blend_minmax EXT_color_buffer_half_float EXT_disjoint_timer_query EXT_float_blend EXT_frag_depth EXT_shader_texture_lod EXT_sRGB EXT_texture_compression_bptc EXT_texture_compression_rgtc EXT_texture_filter_anisotropic OES_element_index_uint OES_standard_derivatives OES_texture_float OES_texture_float_linear OES_texture_half_float OES_texture_half_float_linear OES_vertex_array_object WEBGL_color_buffer_float WEBGL_compressed_texture_astc WEBGL_compressed_texture_etc WEBGL_compressed_texture_s3tc WEBGL_compressed_texture_s3tc_srgb WEBGL_debug_renderer_info WEBGL_debug_shaders WEBGL_depth_texture WEBGL_draw_buffers WEBGL_lose_context
  • webgl1Renderer: Intel Open Source Technology Center -- Mesa DRI Intel(R) UHD Graphics 620 (Kabylake GT2)
  • webgl1Version: 3.0 Mesa 19.0.2
  • webgl1WSIInfo: GLX 1.4 GLX_VENDOR(client): Mesa Project and SGI GLX_VENDOR(server): SGI Extensions: GLX_ARB_create_context GLX_ARB_create_context_profile GLX_ARB_create_context_robustness GLX_ARB_fbconfig_float GLX_ARB_framebuffer_sRGB GLX_ARB_get_proc_address GLX_ARB_multisample GLX_EXT_buffer_age GLX_EXT_create_context_es2_profile GLX_EXT_create_context_es_profile GLX_EXT_fbconfig_packed_float GLX_EXT_framebuffer_sRGB GLX_EXT_import_context GLX_EXT_texture_from_pixmap GLX_EXT_visual_info GLX_EXT_visual_rating GLX_INTEL_swap_event GLX_MESA_copy_sub_buffer GLX_MESA_query_renderer GLX_MESA_swap_control GLX_OML_swap_method GLX_OML_sync_control GLX_SGIS_multisample GLX_SGIX_fbconfig GLX_SGIX_pbuffer GLX_SGIX_visual_select_group GLX_SGI_make_current_read GLX_SGI_swap_control GLX_SGI_video_sync
  • webgl2DriverExtensions: GL_3DFX_texture_compression_FXT1 GL_AMD_conservative_depth GL_AMD_depth_clamp_separate GL_AMD_draw_buffers_blend GL_AMD_gpu_shader_int64 GL_AMD_multi_draw_indirect GL_AMD_query_buffer_object GL_AMD_seamless_cubemap_per_texture GL_AMD_shader_stencil_export GL_AMD_shader_trinary_minmax GL_AMD_texture_texture4 GL_AMD_vertex_shader_layer GL_AMD_vertex_shader_viewport_index GL_ANGLE_texture_compression_dxt3 GL_ANGLE_texture_compression_dxt5 GL_APPLE_object_purgeable GL_ARB_ES2_compatibility GL_ARB_ES3_1_compatibility GL_ARB_ES3_2_compatibility GL_ARB_ES3_compatibility GL_ARB_arrays_of_arrays GL_ARB_base_instance GL_ARB_blend_func_extended GL_ARB_buffer_storage GL_ARB_clear_buffer_object GL_ARB_clear_texture GL_ARB_clip_control GL_ARB_compressed_texture_pixel_storage GL_ARB_compute_shader GL_ARB_conditional_render_inverted GL_ARB_conservative_depth GL_ARB_copy_buffer GL_ARB_copy_image GL_ARB_cull_distance GL_ARB_debug_output GL_ARB_depth_buffer_float GL_ARB_depth_clamp GL_ARB_derivative_control GL_ARB_direct_state_access GL_ARB_draw_buffers GL_ARB_draw_buffers_blend GL_ARB_draw_elements_base_vertex GL_ARB_draw_indirect GL_ARB_draw_instanced GL_ARB_enhanced_layouts GL_ARB_explicit_attrib_location GL_ARB_explicit_uniform_location GL_ARB_fragment_coord_conventions GL_ARB_fragment_layer_viewport GL_ARB_fragment_shader GL_ARB_fragment_shader_interlock GL_ARB_framebuffer_no_attachments GL_ARB_framebuffer_object GL_ARB_framebuffer_sRGB GL_ARB_get_program_binary GL_ARB_get_texture_sub_image GL_ARB_gpu_shader5 GL_ARB_gpu_shader_fp64 GL_ARB_gpu_shader_int64 GL_ARB_half_float_pixel GL_ARB_half_float_vertex GL_ARB_indirect_parameters GL_ARB_instanced_arrays GL_ARB_internalformat_query GL_ARB_internalformat_query2 GL_ARB_invalidate_subdata GL_ARB_map_buffer_alignment GL_ARB_map_buffer_range GL_ARB_multi_bind GL_ARB_multi_draw_indirect GL_ARB_occlusion_query2 GL_ARB_pipeline_statistics_query GL_ARB_pixel_buffer_object GL_ARB_point_sprite GL_ARB_polygon_offset_clamp GL_ARB_post_depth_coverage GL_ARB_program_interface_query GL_ARB_provoking_vertex GL_ARB_query_buffer_object GL_ARB_robust_buffer_access_behavior GL_ARB_robustness GL_ARB_sample_shading GL_ARB_sampler_objects GL_ARB_seamless_cube_map GL_ARB_seamless_cubemap_per_texture GL_ARB_separate_shader_objects GL_ARB_shader_atomic_counter_ops GL_ARB_shader_atomic_counters GL_ARB_shader_ballot GL_ARB_shader_bit_encoding GL_ARB_shader_clock GL_ARB_shader_draw_parameters GL_ARB_shader_group_vote GL_ARB_shader_image_load_store GL_ARB_shader_image_size GL_ARB_shader_objects GL_ARB_shader_precision GL_ARB_shader_stencil_export GL_ARB_shader_storage_buffer_object GL_ARB_shader_subroutine GL_ARB_shader_texture_image_samples GL_ARB_shader_texture_lod GL_ARB_shader_viewport_layer_array GL_ARB_shading_language_420pack GL_ARB_shading_language_packing GL_ARB_stencil_texturing GL_ARB_sync GL_ARB_tessellation_shader GL_ARB_texture_barrier GL_ARB_texture_buffer_object GL_ARB_texture_buffer_object_rgb32 GL_ARB_texture_buffer_range GL_ARB_texture_compression_bptc GL_ARB_texture_compression_rgtc GL_ARB_texture_cube_map_array GL_ARB_texture_filter_anisotropic GL_ARB_texture_float GL_ARB_texture_gather GL_ARB_texture_mirror_clamp_to_edge GL_ARB_texture_multisample GL_ARB_texture_non_power_of_two GL_ARB_texture_query_levels GL_ARB_texture_query_lod GL_ARB_texture_rectangle GL_ARB_texture_rg GL_ARB_texture_rgb10_a2ui GL_ARB_texture_stencil8 GL_ARB_texture_storage GL_ARB_texture_storage_multisample GL_ARB_texture_swizzle GL_ARB_texture_view GL_ARB_timer_query GL_ARB_transform_feedback2 GL_ARB_transform_feedback3 GL_ARB_transform_feedback_instanced GL_ARB_transform_feedback_overflow_query GL_ARB_uniform_buffer_object GL_ARB_vertex_array_bgra GL_ARB_vertex_array_object GL_ARB_vertex_attrib_64bit GL_ARB_vertex_attrib_binding GL_ARB_vertex_buffer_object GL_ARB_vertex_shader GL_ARB_vertex_type_10f_11f_11f_rev GL_ARB_vertex_type_2_10_10_10_rev GL_ARB_viewport_array GL_ATI_blend_equation_separate GL_ATI_texture_float GL_EXT_abgr GL_EXT_blend_equation_separate GL_EXT_draw_buffers2 GL_EXT_draw_instanced GL_EXT_framebuffer_blit GL_EXT_framebuffer_multisample GL_EXT_framebuffer_multisample_blit_scaled GL_EXT_framebuffer_object GL_EXT_framebuffer_sRGB GL_EXT_packed_depth_stencil GL_EXT_packed_float GL_EXT_pixel_buffer_object GL_EXT_polygon_offset_clamp GL_EXT_provoking_vertex GL_EXT_shader_framebuffer_fetch GL_EXT_shader_framebuffer_fetch_non_coherent GL_EXT_shader_integer_mix GL_EXT_shader_samples_identical GL_EXT_texture_array GL_EXT_texture_compression_dxt1 GL_EXT_texture_compression_rgtc GL_EXT_texture_compression_s3tc GL_EXT_texture_filter_anisotropic GL_EXT_texture_integer GL_EXT_texture_sRGB GL_EXT_texture_sRGB_decode GL_EXT_texture_shared_exponent GL_EXT_texture_snorm GL_EXT_texture_swizzle GL_EXT_timer_query GL_EXT_transform_feedback GL_EXT_vertex_array_bgra GL_EXT_vertex_attrib_64bit GL_IBM_multimode_draw_arrays GL_INTEL_conservative_rasterization GL_INTEL_performance_query GL_INTEL_shader_atomic_float_minmax GL_KHR_blend_equation_advanced GL_KHR_blend_equation_advanced_coherent GL_KHR_context_flush_control GL_KHR_debug GL_KHR_no_error GL_KHR_robust_buffer_access_behavior GL_KHR_robustness GL_KHR_texture_compression_astc_ldr GL_KHR_texture_compression_astc_sliced_3d GL_MESA_pack_invert GL_MESA_shader_integer_functions GL_MESA_texture_signed_rgba GL_NV_conditional_render GL_NV_depth_clamp GL_NV_fragment_shader_interlock GL_NV_packed_depth_stencil GL_NV_texture_barrier GL_OES_EGL_image GL_S3_s3tc
  • webgl2Extensions: EXT_color_buffer_float EXT_disjoint_timer_query EXT_float_blend EXT_texture_compression_bptc EXT_texture_compression_rgtc EXT_texture_filter_anisotropic OES_texture_float_linear WEBGL_compressed_texture_astc WEBGL_compressed_texture_etc WEBGL_compressed_texture_s3tc WEBGL_compressed_texture_s3tc_srgb WEBGL_debug_renderer_info WEBGL_debug_shaders WEBGL_lose_context
  • webgl2Renderer: Intel Open Source Technology Center -- Mesa DRI Intel(R) UHD Graphics 620 (Kabylake GT2)
  • webgl2Version: 4.5 (Core Profile) Mesa 19.0.2
  • webgl2WSIInfo: GLX 1.4 GLX_VENDOR(client): Mesa Project and SGI GLX_VENDOR(server): SGI Extensions: GLX_ARB_create_context GLX_ARB_create_context_profile GLX_ARB_create_context_robustness GLX_ARB_fbconfig_float GLX_ARB_framebuffer_sRGB GLX_ARB_get_proc_address GLX_ARB_multisample GLX_EXT_buffer_age GLX_EXT_create_context_es2_profile GLX_EXT_create_context_es_profile GLX_EXT_fbconfig_packed_float GLX_EXT_framebuffer_sRGB GLX_EXT_import_context GLX_EXT_texture_from_pixmap GLX_EXT_visual_info GLX_EXT_visual_rating GLX_INTEL_swap_event GLX_MESA_copy_sub_buffer GLX_MESA_query_renderer GLX_MESA_swap_control GLX_OML_swap_method GLX_OML_sync_control GLX_SGIS_multisample GLX_SGIX_fbconfig GLX_SGIX_pbuffer GLX_SGIX_visual_select_group GLX_SGI_make_current_read GLX_SGI_swap_control GLX_SGI_video_sync
  • windowLayerManagerRemote: True
  • windowLayerManagerType: Basic
  • windowUsingAdvancedLayers: False

Modified Preferences

Misc

  • User JS: No
  • Accessibility: No
jscher2000
  • Top 10 Contributor
8642 solutions 70715 answers

If you retrieve XML or JSON via XMLHttpRequest, Firefox wouldn't insert that the response into the page on its own. Does this occur only in Firefox, not in other browsers?

Since your screenshot mentioned editing data, you probably can't share a URL. However, if you can create a reduced test case that exhibits the same problem, that might be helpful.

If you retrieve XML or JSON via XMLHttpRequest, Firefox wouldn't insert that the response into the page on its own. Does this occur only in Firefox, not in other browsers? Since your screenshot mentioned editing data, you probably can't share a URL. However, if you can create a reduced test case that exhibits the same problem, that might be helpful.
Was this helpful to you?
Quote

Question owner

I agree that this makes no sense. It also doesn't always happen. This is a genealogy application, as you can see from the screen, and the specific situation is where I am editing one of the children of a family. So the edit page which you see in the screenshot is the standard editor for a person in the tree. If I invoke that editor manually, by entering the URL:

https://www.jamescobban.net/FamilyTree/editIndivid.php?rowid=child3&idir=133076&idcr=92756&initGivenName=Ann&initGender=female&initSurname=Cross&initBirthDate=about%201858&initDeathDate=&treeName=&debug=n

which is exactly the same URL as the failing page, then I can edit and save the person and everything works fine. The server script is invoked to update the database and the JSON output is returned to the function. However when this URL is invoked from the editor page for the family by clicking on the edit child button, it generates the strange JSON overlay. Since the URL is the same the only thing that I can think of that is different is the opener, which points to the page describing the family, which is the page containing the table row with id=child3. But that is only used to request the calling page to update the information which it displays about the child, which is only done *after* the JSON response is received from the server. Because my JS code is not receiving that response the application ends up blocked. In particular that response has to come in to set disable to false on all of the "edit child" buttons in the invoking page.

I have reproduced the problem on Chromium. It gives exactly the same output, as shown in the attachment.

Some piece of code is creating the HTML overlay which contains the JSON response code and it is not mine. I do not have any application code that emits a <pre> or the very special head section which declares that the contents of the document are JSON text.

I agree that this makes no sense. It also doesn't always happen. This is a genealogy application, as you can see from the screen, and the specific situation is where I am editing one of the children of a family. So the edit page which you see in the screenshot is the standard editor for a person in the tree. If I invoke that editor manually, by entering the URL: https://www.jamescobban.net/FamilyTree/editIndivid.php?rowid=child3&idir=133076&idcr=92756&initGivenName=Ann&initGender=female&initSurname=Cross&initBirthDate=about%201858&initDeathDate=&treeName=&debug=n which is exactly the same URL as the failing page, then I can edit and save the person and everything works fine. The server script is invoked to update the database and the JSON output is returned to the function. However when this URL is invoked from the editor page for the family by clicking on the edit child button, it generates the strange JSON overlay. Since the URL is the same the only thing that I can think of that is different is the opener, which points to the page describing the family, which is the page containing the table row with id=child3. But that is only used to request the calling page to update the information which it displays about the child, which is only done *after* the JSON response is received from the server. Because my JS code is not receiving that response the application ends up blocked. In particular that response has to come in to set disable to false on all of the "edit child" buttons in the invoking page. I have reproduced the problem on Chromium. It gives exactly the same output, as shown in the attachment. Some piece of code is creating the HTML overlay which contains the JSON response code and it is not mine. I do not have any application code that emits a &lt;pre&gt; or the very special head section which declares that the contents of the document are JSON text.
Was this helpful to you?
Quote
jscher2000
  • Top 10 Contributor
8642 solutions 70715 answers

Hmm, possibly something in the example code you started from has some kind of debugging output so you can see the response while testing?? This isn't really possible to answer without hands on, I don't think.

Hmm, possibly something in the example code you started from has some kind of debugging output so you can see the response while testing?? This isn't really possible to answer without hands on, I don't think.
Was this helpful to you?
Quote

Question owner

Thank you for continuing to follow this even though it appears unrelated to the specific browser.

The core of the sample code from Flanagan's book is:

   request.onreadystatechange = function() {

if (request.readyState == 4) { if (request.status == 200) { callback(HTTP._getResponse(request)); } else { if (errorHandler) errorHandler(request.status, request.statusText); else callback(null); } }

   }

First weird event: My errorHandler is called with request.status == 0! Since that is not an HTTP status code, how could that happen? How could ANYTHING that I do in my application cause this to happen.

Second weird event: I never received a 200 response with the result that HTTP._getResponse was never called. _getResponse invokes JSON.parse for JSON documents and passes the resulting JS object to my application.

Thank you for continuing to follow this even though it appears unrelated to the specific browser. The core of the sample code from Flanagan's book is: request.onreadystatechange = function() { if (request.readyState == 4) { if (request.status == 200) { callback(HTTP._getResponse(request)); } else { if (errorHandler) errorHandler(request.status, request.statusText); else callback(null); } } } First weird event: My errorHandler is called with request.status == 0! Since that is not an HTTP status code, how could that happen? How could ANYTHING that I do in my application cause this to happen. Second weird event: I never received a 200 response with the result that HTTP._getResponse was never called. _getResponse invokes JSON.parse for JSON documents and passes the resulting JS object to my application.
Was this helpful to you?
Quote
jscher2000
  • Top 10 Contributor
8642 solutions 70715 answers

Helpful Reply

jamescobban said

First weird event: My errorHandler is called with request.status == 0! Since that is not an HTTP status code, how could that happen? How could ANYTHING that I do in my application cause this to happen.

Well, according to /docs/Web/API/XMLHttpRequest/status:

Before the request completes, the value of status is 0. Browsers also report a status of 0 in case of XMLHttpRequest errors.

Since you have readyState == 4, it seems the error is the more likely explanation. Did statusText say anything meaningful?

If you check Firefox's Network Monitor, can you see any issues with the response to the request?

To open the Network Monitor in the lower part of the tab, you can use either:

  • "3-bar" menu button > Web Developer > Network
  • (menu bar) Tools > Web Developer > Network
  • (Windows) Ctrl+Shift+e

Firefox won't start listing files it is requesting until the first new request. Then you'll see the status code at the left and if you click the request, you can access headers and the response in the panels available on the right.

''jamescobban [[#answer-1234280|said]]'' <blockquote>First weird event: My errorHandler is called with request.status == 0! Since that is not an HTTP status code, how could that happen? How could ANYTHING that I do in my application cause this to happen. </blockquote> Well, according to [https://developer.mozilla.org/docs/Web/API/XMLHttpRequest/status /docs/Web/API/XMLHttpRequest/status]: <blockquote>Before the request completes, the value of <code>status</code> is 0. Browsers also report a status of 0 in case of <code>XMLHttpRequest</code> errors.</blockquote> Since you have readyState == 4, it seems the error is the more likely explanation. Did statusText say anything meaningful? If you check Firefox's Network Monitor, can you see any issues with the response to the request? To open the Network Monitor in the lower part of the tab, you can use either: * "3-bar" menu button > Web Developer > Network * (menu bar) Tools > Web Developer > Network * (Windows) Ctrl+Shift+e Firefox won't start listing files it is requesting until the first new request. Then you'll see the status code at the left and if you click the request, you can access headers and the response in the panels available on the right.
Was this helpful to you? 1
Quote

Helpful Reply

The network monitor shows the POST request invoking the script that generates the JSON response.

There is nothing in the text string returned with status 0.

I stuck a bunch of console.logs all through the code and finally found an error in a line of code in my JS that is only executed in the specific situation where the AJAX call was failing. Fixing that problem results in the request succeeding every time.

Thank you for your patience and support.

The network monitor shows the POST request invoking the script that generates the JSON response. There is nothing in the text string returned with status 0. I stuck a bunch of console.logs all through the code and finally found an error in a line of code in my JS that is only executed in the specific situation where the AJAX call was failing. Fixing that problem results in the request succeeding every time. Thank you for your patience and support.
Was this helpful to you? 1
Quote
Ask a question

You must log in to your account to reply to posts. Please start a new question, if you do not have an account yet.